dropdown menu and javascript form change

dropdown menu and javascript form change

I am trying to change some form options based on a dropdown selection. I
think I wrote the javascript correctly but I am not sure. If someone could
atleast get me pointed in the right direction or if there is a better way
to accomplish the same thing that would be fine as well. I am a newbie to
javascript.
Here is the code.
<form method="post">
<div class="row requiredRow">
<label for="ClassName" id="ClassName-ariaLabel">Class Name:</label>
<input id="ClassName" name="ClassName" type="text"
aria-labelledby="ClassName-ariaLabel" class="required" title="Class
Name:. This is a required field">
</div>
<div class="row">
<label for="ProfessorName" id="ProfessorName-ariaLabel">Professor
Name:</label>
<input id="ProfessorName" name="ProfessorName" type="text"
aria-labelledby="ProfessorName-ariaLabel">
</div>
<div class="row requiredRow">
<label for="GradingScale" id="GradingScale-ariaLabel">Grading
Scale:</label>
<select id="GradingScale" name="GradingScale"
aria-labelledby="GradingScale-ariaLabel" class="required"
title="Grading Scale:. This is a required field">
<option value="1">A,A-,B+,B,B-,C+,C,C-,D+,D,D-,F</option>
<option value="2">A,B,C,D,F</option>
</select>
</div>
<div class='grades'>
<script>
var e = document.getElementById("GradingScale");
var scale = e.options[e.selectedIndex].value;
if (scale = 2)
{
document.write("<p>Grading Scale:</p><br />");
document.write("A: <input type='text' name='grade-a'><br />");
document.write("B: <input type='text' name='grade-b'><br />");
document.write("C: <input type='text' name='grade-c'><br />");
document.write("D: <input type='text' name='grade-d'><br />");
document.write("F: <input type='text' name='grade-f'><br />");
}
else if (scale = 1)
{
document.write("<p>Grading Scale:</p><br />");
document.write("A: <input type='text' name='grade-a'><br />");
document.write("A-: <input type='text' name='grade-a-'><br />");
document.write("B+: <input type='text' name='grade-b+'><br />");
document.write("B: <input type='text' name='grade-b'><br />");
document.write("B-: <input type='text' name='grade-b-'><br />");
document.write("C+: <input type='text' name='grade-c+'><br />");
document.write("C: <input type='text' name='grade-c'><br />");
document.write("C-: <input type='text' name='grade-c-'><br />");
document.write("D+: <input type='text' name='grade-d+'><br />");
document.write("D: <input type='text' name='grade-d'><br />");
document.write("D-: <input type='text' name='grade-d-'><br />");
document.write("F: <input type='text' name='grade-f'><br />");
}
</script>
</div>
<div class="row">
<input type="submit" value="Add Class">
</div>
</form>