How to add and remove class using ajax based on cart count

Question

My cart is incremented using an ajax call. I want to add a class when the counter is 1 and remove a class when the counter is 0. Can someone tell me how can I achieve this without a page load? Is there any ajax query which fires automatically when the counter increments and decrements? https://prnt.sc/1xaim0a
https://prnt.sc/1xaipj8

Answer 1

Why don't check after ajax call the value of counter and update according that the class. This is an exemple of ajax callback.

function (data) {
    if(data.counter == 0){
         $('#id').removeClass('the-class');
    }else{
         $('#id').addClass('the-class');
    }
}

Answer 2

 $(document).on("click", function () { var count_new = 0; var subtotal_new = 0; setTimeout(function () { jQuery.getJSON('/cart.js', function (data) { count_new = data.item_count; if (parseInt(count_new) == 0) { $(".Cart_click").find(".mobile-icons").find(".hotiya").removeClass("cart_ping") } else { $(".Cart_click").find(".mobile-icons").find(".hotiya").addClass("cart_ping") } }); }, 500); });

I devised a solution.