I need to use a switch statement to display a percent range that a grade falls into as well as the letter grade for that percentage based on a average

I am having trouble setting this up as I am sure I need two variables. One for the letter grade and a second one for the percent range. The switch statement should use the variable avg for the average as that is what is being displayed.

I tried using if statements before the switch to determine what the letter and percent range would be based on the average and then simply having the switch statement cases display them based on the if's, but I am sure that has to be done inside the switch structure.

Here is my code.

<!DOCTYPE>
<html lang = "en">
<head>
<title>CIS 223 Chapter 4 Program</title>
</head>
<script>
function getStudent() 
{
var fName = prompt("Enter the first name of the student:");
var lName = prompt("Enter the last name of the student:");
var grade_one;
var grade_two;
var grade_three;
var grade_four;
var grade_five;
var avg;
var per;
var letter;
var uppercase_fName = fName.toUpperCase();
var lowercase_lName = lName.toLowerCase();
document.write('<table width="25%" border="1">');
document.write('<tr>');
document.write('<td>First Name</td>');
document.write('<td width="50">' + uppercase_fName + '</td>');
document.write('</tr>');
document.write('<tr>');     
document.write('<td>Last Name</td>');
document.write('<td width="50">' + lowercase_lName + '</td>');
document.write('</tr>');  
     
while (grade_one != -1 && grade_two != -1 && grade_three!= -1){
    grade_one = prompt('Enter grade 1 (-1 to stop)')
    // Keep asking for grade_one until it's a valid grade.
    while (isNaN(grade_one < -1 || grade_one > 100)){
        grade_one = prompt('Enter grade 1 again')
    }
    // Only add the grade if you don't entered -1.
    if(grade_one != -1){        
       document.write('<tr>');
       document.write('<td>Grade 1</td>');
       document.write('<td width="50">' + grade_one + '</td>');
       document.write('</tr>');

        grade_two = prompt('Enter grade 2 (-1 to stop)')
        // Keep asking for grade_two until it's a valid grade.
        while (isNaN(grade_two < -1 || grade_two > 100)) {
            grade_two = prompt('Enter grade 2 again')
        }
        // Only add the grade if you don't enter -1.
        if(grade_two != -1){     
            document.write('<tr>');
            document.write('<td>Grade 2</td>');
            document.write('<td width="50">' + grade_two + '</td>');
            document.write('</tr>');  
            
             grade_three = prompt('Enter grade 3 (-1 to stop)')
        // Keep asking for grade_two until it's a valid grade.
        while (isNaN(grade_three < -1 || grade_three > 100)) {
            grade_three = prompt('Enter grade 3 again')
        }
        // Only add the grade if you don't enter -1.
        if(grade_three != -1){     
            document.write('<tr>');
            document.write('<td>Grade 3</td>');
            document.write('<td width="50">' + grade_three + '</td>');
            document.write('</tr>'); 
            
                 grade_four = prompt('Enter grade 4 (-1 to stop)')
        // Keep asking for grade_two until it's a valid grade.
        while (isNaN(grade_four < -1 || grade_four > 100)) {
            grade_four = prompt('Enter grade 4 again')
        }
        // Only add the grade if you don't enter -1.
        if(grade_four != -1){     
            document.write('<tr>');
            document.write('<td>Grade 4</td>');
            document.write('<td width="50">' + grade_four + '</td>');
            document.write('</tr>'); 
            
                 grade_five = prompt('Enter grade 5 (-1 to stop)')
        // Keep asking for grade_two until it's a valid grade.
        while (isNaN(grade_five < -1 || grade_five > 100)) {
            grade_five = prompt('Enter grade 5 again')
        }
        // Only add the grade if you don't enter -1.
        if(grade_five != -1){     
            document.write('<tr>');
            document.write('<td>Grade 5</td>');
            document.write('<td width="50">' + grade_five + '</td>');
            document.write('</tr>');  
            break;
                    }  
                }
            }
        }
    }  
}
avg = +grade_one + +grade_two + +grade_three + +grade_four + +grade_five;

   document.write('</table>');
   document.write('Semester Average:' + avg / 5);
   
  switch (avg)
  {
  case 1:
   letter = "A";
   per = "90-100"
   document.write("Based on your semester average, your grade falls between " + per + "%");
   document.write("you earned a " + letter);
   break;

   case 2:
   letter = "B";
   per = "80-89.9"
   document.write("Based on your semester average your grade falls between " + per + "%");
   document.write("you earned a " + letter);
   break;
   
   case 3:
   letter = "A";
   per = "70-79.9"
   document.write("Based on your semester average your grade falls between " + per + "%");
   document.write("you earned a " + letter);
   break;
   
   case 4:
   letter = "D";
   per = "60-69.9"
   document.write("Based on your semester average your grade falls between " + per + "%");
   document.write("you earned a " + letter);
   break;
   
   case 5:
   letter = "F";
   per = "Below 60%"
   document.write("Based on your semester average your grade falls between " + per + "%");
   document.write("you earned a " + letter);
   
   default:
   document.write("Invalid Entry");
   break; 
   }  
}
</script>
<body>
<h1>Student Grade Report</h1> <br>
<h3>Click the button to begin</h3>
<button onclick="getStudent()">Calculate</button>
</body>
</html>

For the cases, I am not sure if you could use something like "case avg < 60" for if the grade is less than 60% or not since the average is a calculation and not a single numeric input like a 1 - 10 switch statement.