I expect the browser to print the values from 10 to 1 in an empty p tag using JavaScript, but it's printing 1 to 10.
Why does it print above the old line, and not below it?
<!-- Button for printing "i" -->
<input type="button" value="print i">
<!-- Empty p tag where the values of "i" will be printed -->
<p></p>
<script>
// Function for printing "i"
function print() {
var i = 10;
while(i > 0) {
// Grabs the empty p tag
var p = document.getElementsByTagName("p")[0];
// Prints the values of "i" on the p tag
p.innerHTML = "i: " + i + "<br>" + p.innerHTML;
i = i -1;
}
}
// Calls the function for printing "i"
document.getElementsByTagName("input")[0].onclick=function() {
print();
}
</script>
test-standalone.html