JSFiddle - React, Tailwind, and code Playground

by Alexey

HTML

<div class="ddd">


<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>

</div>
<div class="ddd">


<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>

</div>
<div class="ddd">


<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>

</div>
<div class="ddd">


<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>

</div>
<div class="ddd">


<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class = "td"></div>
<div class =...

CSS

.td {
  outline: 1px solid red;
  height: 15px;
  width: 15px;
  /* display: inline-block; */
  color: red;
}
.ddd  {
  display: inline-block;
}

JavaScript

let zzz = document.querySelectorAll('.td');
console.log(zzz);
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]

for (let i = 0; i < zzz.length; i++) {
if(arr[i])
  zzz[i].innerHTML = arr[i];
}

//alert(zzz);