javascript - 为通过 .createElement ('div' 创建的 div 的所有元素设置样式

Question

所以我在另一个父级中创建了多个新的子 div div使用此代码:

var parentDiv = document.querySelector('.parent-div')
const newDiv = document.createElement('div');
parentDiv.appendChild(newDiv);

所以现在我想添加一个 onlick每个事件 div我创建了，它会为每个其他人重置颜色 div在父级内部 div ，这样就不会选中多个子div，然后只为点击的div设置颜色到另一种颜色!
有任何想法吗？

Answer 1

var parentDiv = document.querySelector('.parent-div');
for (let i = 0; i < 10; ++i) {
  const newDiv = document.createElement('div');
  newDiv.className = "my-class";
  newDiv.innerText = `Foo${i}`;
  parentDiv.appendChild(newDiv);
}
parentDiv.onclick = (event) => {
  document.querySelectorAll('.my-class').forEach((el) => {
    el.className = "my-class";
  });
  event.target.className += " active";
}

.my-class {
  color: red;
}

.active {
  color: blue;
}

<div class="parent-div"></div>