title: Shopify {{cart.total_price}} not updating when used outside of CSS class
body: <p>I am using the DEBUT theme from Shopify.</p>
  <p>Preview of the theme I am working on - <a href="https://j0sobcxwialjqvz8-24806554.shopifypreview.com" rel="nofollow noreferrer">https://j0sobcxwialjqvz8-24806554.shopifypreview.com</a></p>
  <p>I am trying to add additional functionality to an AJAX Cart widget on my Shopify site.
  Mainly what I am trying to do is add a shipping cost to the cart's total price if the total order hasn't met the free shipping threshold. I am also adding a free shipping bar with the same threshold functionality.</p>
  <p>So something like - If {{cart.total_price}} is equal/above $25 show &quot;Free Shipping&quot; else {{cart.total_price}} | plus: 7.95</p>
  <p>However, whenever I use the {{cart.total_price}} code without a specific CSS class (example: CSS-Class .total-price) inside the AJAX Cart.. it doesn't update the price if ever there are product changes inside the AJAX Cart.</p>
  <p>There is a jQuery function on one of my liquid.js files that I think is changing the HTML output.</p>
  <p><strong>Could someone help me fix this?</strong></p>
  <p>I just want to be able to use the base Shopify object &quot;cart.total_price&quot; on my liquid codes and make it update prices without having to do a page refresh.</p>
  <p>Here are my codes:</p>
  <pre><code>jQuery('document').ready(function() {
    var windowWidth = jQuery(window).width();
    // QTY CHANGES ON MINICART
    var timer = undefined;
    jQuery('.slideout-cart .qty-form input').keyup(function() {
      if (timer) {
        clearTimeout(timer);
      }
      var self = this;
      timer = setTimeout(function() {
        var input = jQuery(self);
        var qty = input.val();
        var productId = parseInt(input.attr('data-id'));
        if (!(jQuery.isNumeric(qty) &amp;&amp; Math.floor(qty) == qty &amp;&amp; qty &gt;= 0)) {
          updateQty(input, 1, productId);
        } else {
          updateQty(input, qty, productId);
        }
      }, 2000);
    });
    function updateQty(input, qty, productId) {
      input.parent().addClass('loading');
      jQuery.post('/cart/change.js', {
          quantity: qty,
          id: productId
        }, null, &quot;json&quot;)
        .done(function(response) {
  
          if (is_wholesale) {
            window.location.reload();
            return;
          }
  
          var changed = false;
          if (response.item_count &gt; 0) {
            jQuery('.site-header__cart-count &gt; span:first-child').text(response.item_count);
            jQuery('.total-price').html(Shopify.formatMoney(response.total_price, '$\{\{amount\}\}'));
            jQuery('.site-header__cart .cart-price').html(Shopify.formatMoney(response.total_price, '$\{\{amount\}\}'));
            jQuery('.slideout-cart .cart-bottom .subtotal .price').html(Shopify.formatMoney(response.total_price, '$\{\{amount\}\}'));
            for (var i = 0; i &lt; response.items.length; i++) {
              if (response.items[i].id == input.attr('data-id')) {
                input.val(parseInt(response.items[i].quantity));
                jQuery('.slideout-cart ul li[data-id=&quot;' + input.attr('data-id') + '&quot;] .price-box .price').html(Shopify.formatMoney(response.items[i].line_price, '$\{\{amount\}\}'));
                changed = true;
                break;
              };
            }
            if (!changed) {
              jQuery('.slideout-cart ul li[data-id=&quot;' + input.attr('data-id') + '&quot;]').remove();
            }
          } else {
            jQuery('.site-header__cart .cart-price').html(Shopify.formatMoney(0, '$\{\{amount\}\}'));
            jQuery('.site-header__cart-count span:first-child').text('0');
            jQuery('.slideout-cart .cart--empty-message').removeClass('hidden');
            jQuery('.slideout-cart .cart-items-wrapper').addClass('hidden');
          }
        })
        .fail(function(xhr, status, error) {
          // error handling
          console.log(error);
        })
        .always(function() {
          setTimeout(function() {
            input.parent().removeClass('loading');
          }, 1000);
        });
    }
    // END QTY CHANGES ON MINICART
  });
  </code></pre>
  <pre class="lang-html prettyprint-override"><code>&lt;div class=&quot;cart-bottom&quot;&gt;
    &lt;p class=&quot;subtotal&quot;&gt;
      &lt;span&gt;{{ 'cart.general.subtotal' | t }}&lt;/span&gt;
      &lt;span class=&quot;price pull-right&quot;&gt;&lt;span class=&quot;saw-cart-original-total&quot;&gt;{{cart.total_price | money}}&lt;/span&gt; &lt;span class=&quot;saw-cart-total&quot;&gt;&lt;/span&gt; &lt;/span&gt;
    &lt;/p&gt;
  
    {% if section.settings.shipping_text %}
    &lt;p class=&quot;shipping-text&quot;&gt;{{ section.settings.shipping_text }}&lt;/p&gt;{% endif %} {% unless customer.tags.size &gt; 0 %}
    &lt;a href=&quot;/checkout&quot; class=&quot;btn btn-black&quot;&gt;{{ 'cart.general.checkout' | t }}&lt;/a&gt; {% endunless %}
  
    &lt;a href=&quot;/cart&quot; class=&quot;btn btn-hollow&quot;&gt;{{ 'cart.general.view_cart' | t }}&lt;/a&gt; {%- assign settings_free_shipping_above = settings.free_shipping_above -%} {%- assign free_shipping_above = settings_free_shipping_above | times: 1 | default:0 -%} {%- assign
    convert_free_shipping = free_shipping_above | times: 100.0 -%} {%- assign missing_till_free_shipping = convert_free_shipping | minus: cart.total_price -%} {%- assign precent_free_shipping = cart.total_price | divided_by: convert_free_shipping | times:
    100 -%}
    &lt;div class=&quot;threshold_bar gradient stripe color{%- if precent_free_shipping &lt; 50 %} w_0{%- elsif precent_free_shipping &lt; 80 %} w_50 {%- elsif precent_free_shipping &lt; 100 %} w_80{%- else %} w_100{%- endif -%}&quot;&gt;&lt;span class=&quot;animate&quot; style=&quot;width:{%- if missing_till_free_shipping &gt; 0 and missing_till_free_shipping != convert_free_shipping -%}{{precent_free_shipping}}%{%- elsif missing_till_free_shipping != convert_free_shipping -%}100%{%- else-%}0%{%- endif -%} !important&quot;&gt;{%- if missing_till_free_shipping &gt; 0 and missing_till_free_shipping != convert_free_shipping -%}{{precent_free_shipping | round: 1 }}%{%- elsif missing_till_free_shipping != convert_free_shipping -%}100%{%- endif -%}&lt;/span&gt;&lt;/div&gt;
  
    {%- if missing_till_free_shipping &gt; 0 and missing_till_free_shipping != convert_free_shipping -%}
    &lt;p class=&quot;content_threshold&quot;&gt;{{ 'general.shipping_threshold.spend' | t }} &lt;strong&gt;&lt;span class=&quot;amount&quot;&gt;{{ missing_till_free_shipping | money }}&lt;/span&gt;&lt;/strong&gt; {{ 'general.shipping_threshold.more' | t }} &lt;strong class=&quot;gecko-tooltip&quot;&gt;{{ 'general.shipping_threshold.free' | t }}&lt;span class=&quot;gecko-tooltip-label&quot;&gt;{{ 'general.shipping_threshold.days' | t }}&lt;/span&gt;&lt;/strong&gt;
      &lt;a href=&quot;/collections/all?sort_by=best-selling&quot;&gt; {{ 'general.shipping_threshold.continue' | t }}&lt;/a&gt;
      &lt;!-- {{ 'general.shipping_threshold.add_more' | t }} {{convert_free_shipping| money }} --&gt;
    &lt;/p&gt;
    &lt;div class=&quot;cart_total&quot;&gt;
  
      {%- assign minicart_standard_shipping = settings.minicart_standard_shipping -%} {%- assign standard_shipping = minicart_standard_shipping | money_without_currency -%} {%- assign carttotal_with_standard_shipping = cart.total_price | plus: 795 | money_without_currency
      -%}
  
      &lt;div class=&quot;shipping-cost&quot;&gt;
        &lt;p&gt;Standard AU Shipping:&lt;/p&gt;
        &lt;p&gt;${{ standard_shipping }}&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class=&quot;estimated-total&quot;&gt;
        &lt;h4&gt;Total:&lt;/h4&gt;
        &lt;p&gt;${{ carttotal_with_standard_shipping }}&lt;/p&gt;
  
  
        Cart ORIG {{cart.original_total_price}} SubTotal {{cart.items_subtotal_price}}
  
      &lt;/div&gt;
    &lt;/div&gt;
  
    {%- elsif missing_till_free_shipping != convert_free_shipping -%}
    &lt;p class=&quot;content_threshold threshold_congrats&quot;&gt;
      &lt;!-- &lt;i class=&quot;pe-7s-medal&quot; style=&quot;font-size: 16px&quot;&gt;&lt;/i&gt; --&gt;{{ 'general.shipping_threshold.congratulations' | t }}&lt;/p&gt;
    &lt;div class=&quot;cart_total&quot;&gt;
  
      {%- assign minicart_standard_shipping = settings.minicart_standard_shipping -%} {%- assign standard_shipping = minicart_standard_shipping | money_without_currency -%} {%- assign carttotal_with_standard_shipping = cart.total_price | money_without_currency
      -%}
  
      &lt;div class=&quot;shipping-cost&quot;&gt;
        &lt;p&gt;Standard AU Shipping:&lt;/p&gt;
        &lt;p&gt;$0.00&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class=&quot;estimated-total&quot;&gt;
        &lt;h4&gt;Total:&lt;/h4&gt;
        &lt;p&gt;${{ carttotal_with_standard_shipping }}&lt;/p&gt;
  
        Cart ORIG {{cart.original_total_price}} SubTotal {{cart.items_subtotal_price}}
  
      &lt;/div&gt;
    &lt;/div&gt;
    {%- endif -%}
  &lt;/div&gt;
  </code></pre>