title: WooCommerce : Hide shipping calculator depending on selected shipping method
body: <p>I'm trying to hide the shipping calculator on my cart page (using jQuery) depending on which shipping method is selected, first on page load, and then when a user selects another method or updates the cart, that would enable / disable new shipping methods but I can't seem to make it work.</p>
  <p>My Javascript / jQuery is pretty rusty so I don't know what I'm doing wrong.</p>
  <p>The code bellow is what I've tried so far. It does work like I want on page load (= if &quot;free shipping&quot; is selected OR if it's the only available shipping method, the shipping calculator will be hidden.</p>
  <p>But then when I choose another shipping method, the shipping calculator won't show up again unless I manually reload the page.</p>
  <p>It won't work either if the cart is updated with extra product quantities (by increasing the amount of products directly on the cart page) to reach the minimum amount to have free shipping.</p>
  <pre><code>jQuery(document).ready(function() {
      if(jQuery(&quot;*[id*=free_shipping]&quot;).is(':checked') || jQuery(&quot;*[id*=free_shipping]&quot;).is(':hidden') ){
          jQuery(&quot;.woocommerce-shipping-calculator&quot;).css(&quot;display&quot;,&quot;none&quot;);
      }
      else{
          jQuery(&quot;.woocommerce-shipping-calculator&quot;).css(&quot;display&quot;,&quot;block&quot;);
  
      }
  });
  
  
  jQuery(&quot;input[type=radio]&quot;).click(function() {
      if(jQuery(&quot;*[id*=free_shipping]&quot;).is(':checked')){
          jQuery(&quot;.woocommerce-shipping-calculator&quot;).css(&quot;display&quot;,&quot;none !important&quot;);
      }
      else{
          jQuery(&quot;.woocommerce-shipping-calculator&quot;).css(&quot;display&quot;,&quot;block !important&quot;);
  
      }
  })
  </code></pre>
  <p>Any help would be highly appreciated !</p>
  <p>Thanks</p>