I have a list of students' names along with the grades they achieved for the semester. How can I modify my JavaScript code to display the first names of students who earned an "A" grade based on the array provided? This is my current progress, but I know it needs improvement.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript</title>
<script>
var grades= [];
grades [0] = "F";
student [0] = "John";
grades [1] = "D";
student [1] = "George";
grades [2] = "C";
student [2] = "Bill";
grades [3] = "B";
student [3] = "Ted";
grades [4] = "A";
student [4] = "Rick";
function getNames ()
{
for (var i =0;i <grades.length;i++)
{
if (grades[1] = "F")
{
document.getElementById("lowgrade").innerHTML= student[1];
}
else if(grades[1] = "D")
{
document.getElementById("midlowgrade").innerHTML= student[1];
}
else if(grades[1] = "C")
{
document.getElementById("midgrade").innerHTML= student[1];
}
else if(grades[1] = "B")
{
document.getElementById("highgrade").innerHTML= student[1];
}
else if(grades[1] = "A")
{
document.getElementById("bestgrade").innerHTML = student[1];
}
}
</script>
</head>
<body>
<h1>Grade Checker</h1>
<form name = "f1">
Enter Grade<input type ="text" id="grades" name="wed" value="" /><br/>
<input type="button" value="Check Student" onclick="getNames()" />
</form>
<div id="text" />
</body>
</html>