title: How to append item instead of just pasting it
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const Sheet = [
          {
              "Code": "A-0-1", 
              "UPC": "Photos/4009803054728.jpg",
              "Title": "U.S.S. Constitution",
              "Price": "$34",
              "InStock": "7"
          },
     ]
     
  const productsEl = document.querySelector(".Sheet");
  
  function getProducts() {
      Sheet.forEach((product) =&gt; {
          productsEl.innerHTML += `&lt;div class="productContainer"&gt;
              &lt;div class="img"&gt;
                  &lt;img src=${product.UPC} alt="Image Unavailable" height="170px;" width="170px"&gt;
              &lt;/div&gt;
              &lt;div class="itemdesc"&gt;
                  &lt;h2 class="itemName" id="itemName"&gt;${product.Title}&lt;/h2&gt;
                  &lt;h4 class="price"&gt;&lt;span id="price"&gt;${product.Price}&lt;/span&gt;&lt;/h4&gt;
                  &lt;div class="desc"&gt;
                      &lt;p id="desc"&gt;${product.Code}&lt;/p&gt;
                  &lt;/div&gt;
                  &lt;div class="stock"&gt;
                      &lt;p&gt; ${product.InStock} Units&lt;/p&gt;
              &lt;/div&gt;
              &lt;div class="addToCart" onclick="addToCart(this);"&gt;
                  &lt;button id="addToCart" &gt; Add to Cart&lt;/button&gt;
              &lt;/div&gt;
      &lt;/div&gt;`; 
      })
  }
  getProducts(); 
  
  let numUnit = document.getElementById("#Unit")
  let itemTitle = document.getElementById("item")
  let itemPrice = document.getElementById("$Price")
  
  function addToCart(button) {
      const parent = button.closest('.productContainer'),
      Title = parent.querySelector('#itemName')
      Price = parent.querySelector('#price')
      Code = parent.querySelector('#desc')
  
      itemTitle.textContent = Title.innerText + ' ' + Code.innerText
      itemPrice.textContent = Price.innerText
          
  
      //let itemInput = document.createElement('input')
      //itemInput.value = numUnit.innerText
      numUnit.textContent = '1'
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>        &lt;div class="itemUl"&gt;
              &lt;ul&gt;
                  &lt;li id="Units"&gt;Units:&lt;span id="#Unit"&gt;&lt;/span&gt;&lt;/li&gt;
                  &lt;li id="Items"&gt;Item:&lt;span id="item"&gt;&lt;/span&gt;&lt;/li&gt;
                  &lt;li id="Price"&gt;Price:&lt;span id="$Price"&gt;&lt;/span&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="Sheet"&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>What can I change in order to append the task instead of just pasting it in my cart? Currently, I add it to my cart but if press on another object it replace it not add it. By the way, I have a lot of objects in My &quot;Sheet&quot; object I just put one to save space.</p>