Why is this loop stopping at 9 instead of 10.

Question

Why is this loop stopping at 9 instead of 10

<!--HTML-->
<p id = "name"></p>

//Javascript
window.onload = function () {
function runLoop() {
var iteration = 10;
var name = document.querySelector("#name");
name.innerHTML = "";

var i = 0;

var loopFunc = setInterval(function () {
name.innerHTML += i + "<br>";
i++;
if (i == iteration) {
clearInterval(loopFunc);
}
}, 0.1);
}
runLoop();
}

can someone explain why the output is 9 instead of 10
https://code.sololearn.com/W15mGo7gZ461/?ref=app

Answer 1

Try to imagination pre last statement when i==9. It comes to fuction, append text to inner html with 9+ br. Then icrease itself and now i becomes 10. Then you check if i equal 10 stop iterations. So last appending will not be done.
Moreover in this code there are no checking on initial value. For example if you want to print only first value.

So just exchange i++ and condition check and everything will be ok.

Answer 2

do i++ last

Answer 3

Mirielle I understand you well. But there is variable "iteration" in which 10 is assigned to it. And there is a conditional statement for when the variable "i" reaches the variable "iteration". Why doean't the last one count? I mean logic behind that.

Answer 4

george thanks man, your explanation really helps.