Disable click event on Next button on checkout form's first step if all cart products are removed I am new to learning jQuery and JavaScript. I have small task that is becoming hard to solve.

On step one of a checkout form #ps-cart-checkout-form, I have to disable &lt;div class="button"&gt;Next&lt;/div&gt; when cart table is empty or emptied by clicking an "X" image in cart table row So that user does not go forward. Button's location and HTML is: 

&lt;div class="small-right"&gt;
&lt;span class="page"&gt;Side &lt;span class="current"&gt;1&lt;/span&gt;/2&lt;/span&gt;
&lt;div class="button"&gt;Next&lt;/div&gt;
&lt;/div&gt;


Cart table (.table-cart) when having one or more products it contains &lt;thead&gt; tag but when empty the &lt;thead&gt; becomes &lt;tbody&gt; with one row &lt;th&gt; in it. 

My approach:

I have tried to create a module that add js on hook_form_alter. and in js file. I have created :

(function ($) {
Drupal.behaviors.myModule = {
  attach: function (context, settings) {
      var $form = $("#cart-checkout-form");
      if($($form.find("thead").lenght == 0) {
        $(".button").unbind( "click" );
        }

      });
   }
}(jQuery));


With above code I am trying to find out if there is no &lt;thead&gt; that means table is empty and therefore above code should disable the click next button. 
There already having a jQuery code that handles click event on Next div.
What module are you using for the cart?

you can also use preventDefault() function to stop the page from loading to the next page.