Refresh jQuery value

I had this question after viewing How to json encode two arrays.

I am not sure if there is a way to "refresh" a jQuery value or if I would have to make another ajax call instead.

I am using ajax to retrieve my cart contents. Each item in the cart has an individual remove button to remove a particular item from the cart. When a user clicks this, an ajax call is made and the item is removed. Another ajax call is made which updates the number of items in the cart. I need to however also update the cart subtotal because that is the only thing that isn't changing. The subtotal/total of the cart is assigned in the cart display function. Can I just refresh this value? If not, I am not sure how to update or do I have to make another ajax call?

This is my function to show the cart:

function show_cart() {

    $.ajax({
            url: 'functions/show-cart.php',
            type: 'POST',
            dataType: 'json',
        })

        .done(function(data) {
            $.each(data.cart, function(index, item) {

                var showCart = `

				<div class="row hr marg-b-30 marg-t-30">
						<div class="col-md-2 col-sm-2 col-xs-12 marg-b-30">
							<img src="uploads/${item.pic_name}" alt="${item.product_name}" class="">
						</div>
						<div class="col-md-5 col-sm-5 col-xs-12 marg-b-30">
							<a href="#" class=""><b>Product</b></a><b class="right">R${item.price}</b>
							<p class="">${item.product_name}</p>
							<button class="btn btn-xs bg-color--second removeItem" data-id="${item.item_id}" data-itr="${item.i}">Remove <i class="material-icons">delete</i></button>
							
						</div>
						<div class="col-md-3 col-sm-3 col-xs-12 marg-b-30">
							<div class="input input-counter">
								<div class="input__helper pos-left pointer input-counter__plus cartPlus" data-itr="{$i}">
									<i class="material-icons ico-xs"></i>
								</div>
								<input type="text" class="text-center" readonly="" value="${item.each_item}">
								<div class="input__helper pointer input-counter__minus">
									<i class="material-icons ico-xs"></i>
								</div>
							</div>
						</div>
						<div class="col-md-2 col-sm-2 col-xs-12 marg-b-30 text-right text-left-xs">
							<span class="price-xs">R${item.subtotal}</span>
						</div>
					</div>`;

                $(".somediv").append(showCart);


            });

            $("#total").append(data.total);
            $("#subtotal").append(data.total);
            remove_item();
        })

        .fail(function(jqXHR, textStatus, errorThrown) {
            console.log(textStatus + ': ' + errorThrown);
            console.warn(jqXHR.responseText);
        });
}

Select allOpen in new window

This is my function to remove an item:

function remove_item() {

    $("body").on("click", ".removeItem", function() {
        var id = $(this).data('id');
        var indexToRemove = $(this).data('itr');
        var div = $(this).parents("div.hr");
        $.ajax({
                url: 'functions/remove-item.php',
                type: 'POST',
                data: {
                    indexToRemove: indexToRemove
                },
                beforeSend: function() {
                    $(div).html("<img src='images/spinner.gif'>");
                },
            })

            .done(function(data) {
                $(div).fadeOut();
                $.ajax({
                        url: 'functions/basket-total.php',
                        type: 'POST',

                    })
                    .done(function(data) {
                        if (data > 0) {

                            $(".incart").text(data);

                        } else {

                            $(".incart").css({
                                "background": "none",
                                "color": "black"
                            }).text("0");
                        }

                    })
            })



            .fail(function(jqXHR, textStatus, errorThrown) {
                console.log(textStatus + ': ' + errorThrown);
                console.warn(jqXHR.responseText);
            })
    })
} // END REMOVE ITEM

Select allOpen in new window

I am calling  remove_item(); inside the show_cart() function. I am trying to refresh these values. Because I don't have shipping charges yet, the value for both will be identical.

$( "#total" ).append(data.total);
$( "#subtotal" ).append(data.total);

Select allOpen in new window