Как заменить один класс на другой?

Question

[sochi-russia]

Есть код. Он имеет вот такую структуру:

<div class="vmeste vm">
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
<div class="col span_1_of_3">
<div class="name"></div>
</div>
</div>

Это 10 блоков. Как сделать так чтобы класс name изменился поочередно. То-бишь первый блок имел класс c1., второй класс c2, третий c1 и так далее.
Структура должна выглядеть вот так

<div class="vmeste vm">
<div class="col span_1_of_3">
<div class="с1"></div>
</div>
<div class="col span_1_of_3">
<div class="с2"></div>
</div>
<div class="col span_1_of_3">
<div class="с1"></div>
</div>
<div class="col span_1_of_3">
<div class="с2"></div>
</div>
<div class="col span_1_of_3">
<div class="с1"></div>
</div>
<div class="col span_1_of_3">
<div class="с2"></div>
</div>
<div class="col span_1_of_3">
<div class="с1"></div>
</div>
<div class="col span_1_of_3">
<div class="с2"></div>
</div>
<div class="col span_1_of_3">
<div class="с1"></div>
</div>
<div class="col span_1_of_3">
<div class="с2"></div>
</div>
</div>

Вроде бы все просто, меняй классы и все, но проблема в том, что блоки формируются по средствам АПИ и не получается их выставить классы в такой последовательности. Известно всегда, что блоков равное количество их 10

Answer 1

[Тигран Абрамян]

document.querySelectorAll('.name').forEach((name, i) => {
	name.classList.remove('name');

  if (i % 2 === 0) {
    name.classList.add('c1');
  } else {
    name.classList.add('c2');
  }
});

Comments

[sochi-russia]

Спасибо!