Search code examples
javascriptinnerhtmlgetelementsbyclassname

Use innerHTML by class multiple times

I'm trying to insert content based on class however it only works once, how can I make it work multiple times?

See example: .innerHTML only runs once and not on the next occurrences

window.onload = function(){ 
document.getElementsByClassName("0")[0].innerHTML = `text0`;
document.getElementsByClassName("1")[0].innerHTML = `text1`;
document.getElementsByClassName("2")[0].innerHTML = `text2`;
document.getElementsByClassName("3")[0].innerHTML = `text3`;
}
<div class="x 0"></div>
<div class="x 1"></div>
<div class="x 2"></div>
<div class="x 3"></div>
<div class="x 0"></div>
<div class="x 1"></div>
<div class="x 2"></div>
<div class="x 3"></div>

Solution 
  • var elemList = document.getElementsByClassName("0");
for (let i = 0; i < elemList.length; i++) {
    elemList[i].innerHTML = "text0";
}

    An do this with classes 1, 2, etc.