title: Disable and Enable Click event using Jquery
body: <p>Could you please advise how to disable /enable the click function using jquery api. Based on the role i have show the sports page to the user.</p>
  
  <p>Using below bootstrap code for UI.</p>
  
  <pre><code>&lt;div id="viewtest" class="btn-group btn-group-sm"&gt;
      &lt;button id="C" class="btn btn-default" title="Cricket"&gt;Cricket&lt;/button&gt;
      &lt;button id="B" class="btn btn-default" autofocus="autofocus" autofocus title="BaseBall"&gt;BaseBall&lt;/button&gt;
      &lt;button id="T" class="btn btn-default disabled" title="Tennis"&gt;Tennis&lt;/button&gt;
      &lt;button id="G" class="btn btn-default disabled " title="Monthly"&gt;Golf&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I am using below function to handle the above buttons click events.</p>
  
  <pre><code>$(".btn-group &gt; .btn").click(function () {
      $(this).addClass("btn-primary").siblings().removeClass("btn-primary");
      viewtype = this.id;
      $(this).blur();
      showPage();
  });
  </code></pre>
  
  <p>For some criteria , i am disabling the click event using below function</p>
  
  <pre><code>var disableOptionsTabs=["C","T"];
          disableButtons(disableOptionsTabs);
  
  function disableButtons(mybuttons) {
      $.each(mybuttons, function (key, value) {
          $("#" + value).off();
      });
  }
  </code></pre>
  
  <p>Please advise how to enable the click event? or how to bind the click function for button.</p>
  
  <p>I am using below method ,bind the click event for the specify buttons based on given advise . but it's not working.</p>
  
  <pre><code> var enableOptionsTabs=["C","T"];
              enableButtons(enableOptionsTabs);
      function enableButtons(mybuttons){
             $.each( mybuttons, function( key,value ) 
             { $( "#" + value ).on("click",myOnClick);  }
            );
  
      }
  </code></pre>