I’m building my own woocommerce theme with an HTML template that I bought for it. The question is: how can i update the cart’s label text with the ajax when a new product is added?

See my code to display the cart’s count:

<span class="cart_count" name='update_cart'><?= wc()->cart->cart_contents_count?></span>

The button’s code to add a new product to the cart:

<li class="add-to-cart">
  <a product-id="<?= $featured_product->id ?>" href="#" class="single_add_to_cart_button">
    <i class="icon-basket-loaded"></i>
  </a>
</li>

the add-cart.php function:

<?php

function woocommerce_ajax_add_to_cart_js() {
  if (function_exists('is_product') && is_product()) {
      wp_enqueue_script('woocommerce-ajax-add-to-cart', plugin_dir_url(__FILE__) . 'assets/ajax-add-to-cart.js', array('jquery'), '', true);
  }
}
add_action('wp_enqueue_scripts', 'woocommerce_ajax_add_to_cart_js', 99);

add_action('wp_ajax_woocommerce_ajax_add_to_cart', 'woocommerce_ajax_add_to_cart');
add_action('wp_ajax_nopriv_woocommerce_ajax_add_to_cart', 'woocommerce_ajax_add_to_cart');

function woocommerce_ajax_add_to_cart() {
            $product_id = apply_filters('woocommerce_add_to_cart_product_id', absint($_POST['product_id']));
            $quantity = empty($_POST['quantity']) ? 1 : wc_stock_amount($_POST['quantity']);
            $variation_id = absint($_POST['variation_id']);
            $passed_validation = apply_filters('woocommerce_add_to_cart_validation', true, $product_id, $quantity);
            $product_status = get_post_status($product_id);

            if ($passed_validation && WC()->cart->add_to_cart($product_id, $quantity, $variation_id) && 'publish' === $product_status) {

                do_action('woocommerce_ajax_added_to_cart', $product_id);

                if ('yes' === get_option('woocommerce_cart_redirect_after_add')) {
                    wc_add_to_cart_message(array($product_id => $quantity), true);
                }

                WC_AJAX :: get_refreshed_fragments();
            } else {

                $data = array(
                    'error' => true,
                    'product_url' => apply_filters('woocommerce_cart_redirect_after_error', get_permalink($product_id), $product_id));

                echo wp_send_json($data);
            }

            wp_die();
        }

?>

the ajax-add-to-cart.js :

(function ($) {
  $(document).on("click", ".single_add_to_cart_button", function (e) {
    e.preventDefault();

    var $thisbutton = $(this),
      product_qty = 1,
      product_id = $thisbutton.attr("product-id") || id,
      variation_id = 0;

    var data = {
      action: "woocommerce_ajax_add_to_cart",
      product_id: product_id,
      product_sku: "",
      quantity: product_qty,
      variation_id: variation_id,
    };

    $(document.body).trigger("adding_to_cart", [$thisbutton, data]);

    $.ajax({
      type: "post",
      url: wc_add_to_cart_params.ajax_url,
      data: data,
      beforeSend: function (response) {
        $thisbutton.removeClass("added").addClass("loading");
      },
      complete: function (response) {
        $thisbutton.addClass("added").removeClass("loading");
      },
      success: function (response) {
        if (response.error & response.product_url) {
          window.location = response.product_url;
          return;
        } else {
          $(document.body).trigger("added_to_cart", [
            response.fragments,
            response.cart_hash,
            $thisbutton,
          ]);
        }
      },
    });

    return false;
  });
})(jQuery);

I’ve already tried adding a script to the wp_footer:

jQuery('div.woocommerce').on('change', '.qty', function() {
  jQuery("[name='update_cart']").prop("disabled", false);
  jQuery("[name='update_cart']").trigger("click");
});

but I actually don’t know what dom element should be that div.woocommerce.