title: `appendChild` inside a `for` loop just replaces item created by `createElement`
body: <p>I Googled a lot about creating multiple items with <code>appendChild</code>, but I’m not understanding how it works. My <code>appendChild</code> just replaces instead of adding many.</p>
  
  <pre><code>var startGame;
  var cards = 16;
  var newDeck = [];
  
  startGame = function(){
      var startBtn = document.getElementById('start');
      var board = document.getElementById('game-board');
      var backside = document.createElement("div");
      backside.className = 'card';
  
      startBtn.onclick = function(){
          removeButton = document.getElementById("start");
          removeButton.parentNode.removeChild(removeButton);
  
          for(var i = 0; i &lt; cards; i++){ 
              board.appendChild(backside);
          }
      };
  };
  </code></pre>
  
  <p>I also read you can do this with <code>innerHTML</code>, but that leaves me confused as well. Does anyone have a more detailed explanation on how to make this work?</p>