Почему мой цикл for влияет только на первый элемент из моего списка узлов getElementsByClassName? ⇐ Html

[Anonymous]

Я пытаюсь пройти через NodeList класса hot. Я хочу изменить имена их классов на Cool . Когда я использую цикл for, кажется, что второй [*] не меняет цвет. Кто-нибудь знает, в чем моя ошибка?

Код: Выделить всё

var elements = document.getElementsByClassName('hot');
var i;

for(i = 0; i < elements.length; i++) {
elements[i].className = 'cool';
}

Код: Выделить всё

*{
box-sizing: border-box;
}
.hot {
background-color: red;
border: 1px solid black;
padding: 10px;
margin-top: 1px;
font-size: 25px;
list-style-type: none;
}

.cool {
background-color: blue;
padding: 10px;
color: white;
font-size: 25px;
}

Код: Выделить всё

List
Buy Greoceries
[list]
Freshfigs
[*]pine nuts
[*]honey
[*]balsamic vinegear
[/list]

Подробнее здесь: https://stackoverflow.com/questions/359 ... byclassnam