Javascript/ajax не работает при добавлении двух товаров в корзину, как это решить?

На странице просмотра корзины я могу увеличивать и уменьшать количество товара, нажимая кнопки + и -, когда в корзине один товар. Когда я добавляю в корзину более одного товара, кнопка увеличения и уменьшения не работает ни для одного товара.

Работает нормально, когда в корзине находится только один товар.

При добавлении в корзину более одного товара кнопка увеличения(+) и уменьшения(-) не работает.

HTML

{% for cart_product in cart %}
    <tr class="product-row">
        <td>
            <figure class="product-image-container">
                <a href="{{ cart_product.product.get_absolute_url }}" class="product-image">
                    <img src="{{ cart_product.product.product_img_1.url }}" alt="product"
                        class="img-fluid">
                </a>
            </figure>
        </td>
        <td>
            <div class="product-single-qty">
                <div class="input-group bootstrap-touchspin bootstrap-touchspin-injected">

                    <div class="minus-cart value-button"
                        value="Decrease Value" pid="{{ cart_product.product.id }}">-</div>
                    <span class="number">{{ cart_product.quantity }}</span>
                    <div class="plus-cart value-button"
                        value="Increase Value" pid="{{ cart_product.product.id }}">+</div>
                </div>
            </div>
        </td>
        <td class="text-right">
            <span class="subtotal-price each_pro_subtotal">{{ cart_product.total_cost }}</span>
        </td>
    </tr>
{% endfor %}

javascript

$(".plus-cart").click(function(){
    var id = $(this).attr("pid").toString();
    var eml = this.parentNode.children[1];

    $.ajax({
        type : "GET",
        url : "/shop/pluscart",
        data : {
        prod_id : id
        },
        success : function(data){
        eml.innerText = data.quantity;
        each_subtotal = document.getElementsByClassName("each_pro_subtotal");
        each_subtotal[0].innerText = data.each_pro_subtotal;
        document.getElementById("subtotal").innerText = data.subtotal;
        },
    })
});

var eml = $(this).closest('span.number')[0];