JSFiddle - React, Tailwind, and code Playground

by Dedi Wibisono

HTML

<div class="odd">odd</div>
<div class="even">even</div>
<div class="odd">odd</div>
<div class="even">even</div>
<div class="odd">odd</div>
<div class="even">even</div>
<div class="odd">odd</div>
<div class="even">even</div>

<button onclick="update()">add attribute</button>
<!-- <button onclick="setAttributes()">haha</button> -->

JavaScript

function update() {
  let odd = document.getElementsByClassName("odd");
  let even = document.getElementsByClassName("even");
  let newAtt = "";
  let newEven = "";
  
  for (i=0 ; i<odd.length ; i++){
    newAtt = i    
    odd[i].setAttribute("odd","odd")
  }
  
  for (i=0; i<even.length; i++) {
  	newEven = i;
    even[i].setAttribute("even","even")
  }
}