JS更改内部html表单元格

Question

I am self taught PHP with little js experience so it is probably something really simple, but I have made a js function to change the inner html of a table cell and added an onchange event listener on a select element to call the function. However nothing happens when I change the selected value and I have no idea why, considering it is so simple it should. Please help.

td that I want to change:

        echo '<tr><td id="pastEvents">';
        for($i=0;$i<=3;$i++){
            echo '<table class="invisible"><tr><td><img src="/'.$pastEvents[$i]['banner'].'" alt="Event Banner"></td></tr><tr><td>'.$pastEvents[$i]['name'].'</td></tr></table>';
        }
        echo '</td></tr>';

Event Listener:

echo '<tr><td><table class="invisible"><tr><td>Number Shown: <select name="select" onchange="changePast()"><option value="3">3</option><option value="10">10</option><option value="20">20</option><option value="all">All</option></select></td></tr></table></td></tr>';

Script:

<script>
    function changePast(){
        var shown = document.getElementsByName("select");
        document.getElementById("pastEvents").innerhtml = "test";
    }
</script>

Answer 1

The correct way to use is .innerHtml() instead of .innerhtml()

<script>
    function changePast(){
        var shown = document.getElementsByName("select");
        document.getElementById("pastEvents").innerHtml = "test";
    }
</script>

Answer 2

actually it is innerHTML

<div id="A"></div>

document.getElementById("A").innerHTML = 'text'