How come when I hover over one of the child items in my parentDiv, the background of the last childDiv changes no matter which child I place my mouse on?
for (let i = 0; i < Number(height); i++)
{
for (let j = 0; j < Number(width); j++)
{
var 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);
}
}