My school has a special 65% formal 35% informal weighting, so I made something to find what your grade would be if you added or changed a grade.http://retep-mathwizard.github.io/gradecalc/gradecalc.htmlHTML:<!DOCTYPE html><html>  <head>    <title> Grade Calculator</title>    <meta charset=utf-8/>    <link rel=stylesheet type=text/css href=gradecalc.css>    <script type=text/javascript src=gradecalc.js></script>  </head>  <body>    <h1>Grade Calculator</h1>    <input id=ing placeholder=Informal grades, seperate by commas.><br>    <input id=fog placeholder=Formal grades, seperate by commas.><br>    <input type=radio name='type' onclick=changeoldgradedisplay() id='radio_new_grade' >New<br>    <input type=radio name='type' onclick=changeoldgradedisplay() id='radio_old_grade' checked>Change<br>    <input id=old_grade_input display='none' placeholder=old grade>    <input id=new_grade_input placeholder=new grade><br>    <input type=radio name='gradetype' id='informal_radio'>Informal<br>    <input type=radio name='gradetype' id='formal_radio' checked>Formal<br>    <button onclick=add_grades() > Go </button>    <p id='previous_grade'></p>    <p id='new_grade'></p>  </body></html>CSS:#fog, #ing {  width: 300px;}JS:function changeoldgradedisplay() {    if (document.getElementById('radio_old_grade').checked) {        document.getElementById('old_grade_input').style.display = 'block';    } else {        document.getElementById('old_grade_input').style.display = 'none';    }}function get_average(items) {    var sum = 0;    var len = items.length;    for (var i = 0; i < len; i++) {        sum += parseFloat(items[i]);    }    return sum/len;}function add_grades() {    var formal_grades = document.getElementById('fog').value.split(',');    var informal_grades = document.getElementById('ing').value.split(',');    var previous_grade = (get_average(formal_grades) * .65) + (get_average(informal_grades) * .35);    document.getElementById('previous_grade').innerHTML = 'Estimate of previous grade - ' + previous_grade.toFixed(2);    var is_formal = document.getElementById('formal_radio').checked;    var gradelist = null;    if (is_formal) {        new_grade = document.getElementById(new_grade_input).value;        if (document.getElementById('radio_old_grade').checked) {            old_grade = document.getElementById(old_grade_input).value;            formal_grades[formal_grades.indexOf(old_grade)] = new_grade        } else {            formal_grades.push(new_grade);        }    } else {        new_grade = document.getElementById(new_grade_input).value;        if (document.getElementById('radio_old_grade').checked) {            old_grade = document.getElementById(old_grade_input).value;            informal_grades[informal_grades.indexOf(old_grade)] = new_grade        } else {            informal_grades.push(new_grade);        }    }    var new_grade = (get_average(formal_grades) * .65) + (get_average(informal_grades) * .35);    document.getElementById('new_grade').innerHTML = 'Estimate of new grade - ' + new_grade.toFixed(2);}
My grade calculator with special weighting
javascript;css;html5
A couple of minor things:fog and ing aren't very meaningful id names, they would be better as something like formal_grades and informal_grades instead.This part of the code: var is_formal = document.getElementById('formal_radio').checked;    var gradelist = null;if (is_formal) {    new_grade = document.getElementById(new_grade_input).value;    if (document.getElementById('radio_old_grade').checked) {        old_grade = document.getElementById(old_grade_input).value;        formal_grades[formal_grades.indexOf(old_grade)] = new_grade    } else {        formal_grades.push(new_grade);    }} else {    new_grade = document.getElementById(new_grade_input).value;    if (document.getElementById('radio_old_grade').checked) {        old_grade = document.getElementById(old_grade_input).value;        informal_grades[informal_grades.indexOf(old_grade)] = new_grade    } else {        informal_grades.push(new_grade);    }}repeats very similar code where the only difference is which array is used. Also, gradelist isn't used anywhere. You can avoid the repetition like this:var is_formal = document.getElementById('formal_radio').checked;var gradelist = is_formal ? formal_grades : informal_grades;new_grade = document.getElementById(new_grade_input).value;if (document.getElementById('radio_old_grade').checked) {    old_grade = document.getElementById(old_grade_input).value;    gradelist[gradelist.indexOf(old_grade)] = new_grade} else {    gradelist.push(new_grade);}by assigning the array that needs to be used to gradelist. This works because when you assign an array (or any object) to a variable in javascript, it assigns the reference to the array instead of copying the value. For example, if formal_grades is assigned to gradelist they will both refer to the same array.