Discussion on: Why Does JavaScript Do THIS? - Question #1

Besides all the other explanations of the problem, you might not want to update the DOM on every single iteration of the array, as that probably isn't very efficient. Something that runs through the array first and updates the DOM later might be better:

listOfNames.innerHTML = names.reduce((result, name) => result + `<li>${name}</li>`)

Or, if you're not comfortable with reduce, simply:

let list = ""
names.forEach(name => list += `<li>${name}</li>`)

listOfNames.innerHTML = list