I have this html code with javascript. My average value displays correctly but my find minimum is not displaying anything. Its supposed to show when the user clicks on the find min button on the box.

```
 <!DOCTYPE html>
 <html lang="en">
 <head>
<meta charset="UTF-8">
<title>Calculate Your Grade</title>
<link rel="stylesheet" href="calc.css">
<script>
    var $ = function (id) {
        return document.getElementById(id);
    }
    var calculateGrade = function () {
        var exam1 = parseFloat($("exam1").value);
        var exam2 = parseFloat($("exam2").value);
        var exam3=parseFloat($("exam3").value);

        if (isNaN(exam1) || isNaN(exam2) ) {
            alert("All three entries must be numeric");
        }
        else {
            var average = (exam1 + exam2 + exam3) / 3;
            $("average").value = average;
        }

        }   
        var min  = function () {
        var exam1 = parseFloat($("exam1").value);
        var exam2 = parseFloat($("exam2").value);
        var exam3=parseFloat($("exam3").value);

        if ( (exam1<exam2) && (exam1<exam3)){
            $("mini").value=exam1;}
        else if ((exam2<exam1) && (exam2<exam3)){
            $("mini").value=exam2;}
        else {
            $("mini").value=exam3;
            }       
    }
        window.onload = function () {
        $("calculate").onclick = calculateGrade;
        $("mini").onclick = min;

        $("exam1").focus();
        }

</script>
</head>
<body>
<section>
    <h1>Calculate Average</h1>
    <label for="exam1">Exam1:</label>
    <input type="text" id="exam1"><br>
    <label for="exam2">Exam2:</label>
    <input type="text" id="exam2"><br>
    <label for="exam3">Exam3:</label>
    <input type="text" id="exam3"><br>
     <label for="average"></label>
    <input type="text" id="average"disabled ><br>  
    <label>&nbsp;</label>

    <input type="button" id="calculate" value="Calc Avg">
    <input type="button" id="mini" value="Find min"> 
  </section>
 </body>
</html>

```