добавление товаров в корзину js

Уважаемые форумчани, помогите поправить код, добавляю товары в корзину, когда нажимаю на одинаковый товар, значение количества увеличивается, но когда нажимаю на второй товар, код перетирает первую строку и заменяет ее новым товаром, а должен добавлять новую строку

let basket = document.querySelector('#tbody_cart');
let productList = document.querySelectorAll('.product-item');
let productButtons = document.getElementsByClassName('product-item__add-btn');
let goodz = [];
let amount = '';

for (let product of productList) {
   product.addEventListener('click', (e) => {
      if (e.target.tagName == 'BUTTON') {
         goodz.push({ name: e.target.dataset.name, price: e.target.dataset.price, id: e.target.dataset.id, counter: e.target.dataset.counter })
         amount = '$' + parseInt((e.target.dataset.price).substr(1)) * parseInt(e.target.dataset.counter);
         console.log(goodz);
         
         if (goodz.find(elem => elem.id === e.target.dataset.id)) {
            
            basket.innerHTML = basketTemplate(e.target);
            e.target.dataset.counter = Number(e.target.dataset.counter) + 1;
         } else {
            basket.innerHTML += basketTemplate(e.target);
         }
      }
   })
}

function basketTemplate(product) {
   return `<tr height="50" align="center">
           
                  <td> ${goodz.length}</td >
                  <td>${product.dataset.name}</td>
                  <td>${product.dataset.price}</td>
                  <td>${product.dataset.counter}</td>
                  <td>${amount}</td>
                  <td><button class="deleteItem">Delete Item</button></td>
                  </tr > `
}


<div class="table_wraper">
                    <h3 align="center" class="table_title">my basket:</h3>
                    <table class="table_cart" width=" 100%" cellpadding="5" cellspacing="5">
                        <thead>
                            <tr height="50">
                                <th width="10%">N#</th>
                                <th width="35%">Name</th>
                                <th width="15%">Price</th>
                                <th width="10%">Quantity</th>
                                <th width="15%">Amount</th>
                                <th width="15%"></th>
                            </tr>
                        </thead>
                        <tbody id="tbody_cart">

                            <!--<tr height="50" align="center">
                                    <td>2</td>
                                    <td>Standard Jerry shirt</td>
                                    <td>$ 140</td>
                                    <td></td>
                                    <td><a href="">Remove link </a></td>
                            </tr> -->
                        </tbody>
                    </table>