Question

I have a list of HTML elements having class “black” (with some other classes). I want to convert the “black” to “white”. I have written the following code.

var blacks = document.getElementsByClassName("black");
for (i = 0; i < blacks.length; i++)
    blacks[i].className = blacks[i].className.replace('black', 'white');

Interestingly, one element turns to white and one element is skipped until the end of elements. That is, elements with order of even numbers remain unchanged. What am I missing to convert all blacks?

Answer 1

Further to the comment made about blacks being a live nodeList, you can avoid converting to an array, by simply decrementing through the loop:

var blacks = document.getElementsByClassName("black");
for (var i = blacks.length -1 ; i >= 0; --i) {
    blacks[i].className = blacks[i].className.replace('black', 'white');
}​

JS Fiddle demo.