Я хочу добавить этот элемент 'DotsDiv' в каждый элемент 'domino'

Question

Я пытаюсь понять, как добавить два элемента с классом точек к классу domino.

for (i=0; i<10; i++){

  var domino = document.createElement('div');
  domino.className = "domino";
  document.getElementById('dominoes').appendChild(domino);

}

for (j=0; j<2; j++){

  var DotsDiv = document.createElement('div');
  DotsDiv.className = "dots";
  document.querySelector('.domino').appendChild(DotsDiv);

}

Answer 1

Использовать вложенные циклы. Внешний создает .domino элементов, а внутренний добавляет .dots элементов к текущему .domino.

var dominoes = document.getElementById('dominoes');
var i, j, domino, DotsDiv;

for (i = 0; i < 10; i++) {
  domino = document.createElement('div');
  domino.className = "domino";

  for (j = 0; j < 2; j++) {
    DotsDiv = document.createElement('div');
    DotsDiv.className = "dots";
    domino.appendChild(DotsDiv);
  }
  
  dominoes.appendChild(domino);
}

.domino {
  background: gold;
  border: 1px solid black;
}

.dots {
  width: 20px;
  height: 10px;
  background: silver;
  border: 1px solid red;
}

<div id="dominoes"></div>