如何为 php foreach 正确分发 js 代码？

如何解决如何为 php foreach 正确分发 js 代码？

在文件中有 PHP foreach

<?PHP
  foreach($_SESSION['cart'] as $item):
    $sqlcartprod = MysqLi_query(db(),"SELECT * FROM products WHERE id='".$item['product']."' ");
    $rowcartprod = MysqLi_fetch_array($sqlcartprod);
?>
   <tr>
     <td class="shoping__cart__item">
        <img src="<?=$rowcartprod['ikonka']?>" width="101" alt="">
        <h5><?=$rowcartprod['name_'.$lang]?></h5>
     </td>
     <td class="shoping__cart__price" >
        <span id="priceprod"><?=$rowcartprod['price']?></span> azn
     </td>
     <td class="shoping__cart__quantity">
        <div class="quantity">
           <div class="pro-qty">
              <input type="text" style="cursor: default" readonly value="<?=$item['qty']?>">
           </div>
        </div>
     </td>
     <td class="shoping__cart__total" id="totalprice">
         <?=$item['price']*$item['qty']?> azn
     </td>
   </tr>
<?PHP endforeach; ?>

对于这段代码：

<div class="quantity">
  <div class="pro-qty">
    <input type="text" style="cursor: default" readonly value="<?=$item['qty']?>">
  </div>
</div>

有JS代码：

var proQty = $('.pro-qty');
proQty.prepend('<span class="dec qtybtn">-</span>');
proQty.append('<span class="inc qtybtn">+</span>');
proQty.on('click','.qtybtn',function () {

    var $button = $(this);
    var oldValue = $button.parent().find('input').val();


    if ($button.hasClass('inc')) {
        var newVal = parseFloat(oldValue) + 1;
    } else {
        // Don't allow decrementing below zero
        if (oldValue > 0) {
            var newVal = parseFloat(oldValue) - 1;
        } else {
            newVal = 0;
        }
    }
    $button.parent().find('input').val(newVal);

        var Price = document.getElementById('priceprod').innerText;
        var Tprice = document.getElementById('totalprice');
        
        if (Price[i] > 0) {
            Tprice.textContent = (Price[i] * newVal) + ' azn';
        }
});

问题是，当我点击 qtybtn + 或 qtybtn - 时，js 代码仅适用于购物清单中的第一个产品，即使列表中有 2,3 个或更多产品。我试图用循环分隔 js 代码，但随后 js 代码以某种方式完全停止工作。如何正确分发，让js代码分别适用于每个产品？