JSFiddle - React, Tailwind, and code Playground
HTML
<div id="parent">
</div>
CSS
.childDiv {
width: 30px;
height: 30px;
margin-bottom: 5px;
}
JavaScript
let parentDiv = document.getElementById("parent");
for (let i = 0; i < Number(2); i++)
{
for (let j = 0; j < Number(5); j++)
{
let childDiv = document.createElement("div");
childDiv.className = "childDiv";
childDiv.style.backgroundColor = "#e6e6e6";
childDiv.id = `${i};${j}`
childDiv.onclick = () => childDiv.style.backgroundColor = "black";
childDiv.onmouseenter = () => childDiv.style.background = "#cccccc";
childDiv.onmouseleave = () => childDiv.style.background = "#e6e6e6";
parentDiv.appendChild(childDiv);
}
}