title: JQuery UI Tabs - dynamically adding and removing mouseover event
body: <p>I would like to add a mouseover event to a UI tab strip when user clicks on a checkbox, but I am trouble dynamically adding and removing events.  Here is what I have so far.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
   $(function() {  
  
    // add mouseover event when user clicks on checlkbox called chkbEnableMouseOver
    $("#chkbEnableMouseOver").change(function () { 
     if (($("#chkbEnableMouseOver").is(":checked"))){
      $('#tabs').tabs.live("click",function(){   });
     }
     else{    
      $('#tabs').tabs.live("click",function(){   event: 'mouseover'; });
     }
      });
  
   // UI tab strip - no default mouseover event
   $("#tabs").tabs({   });
   // UI tab strip - WITH default mouseover event
   //$("#tabs").tabs({  event: 'mouseover' });
  
  
  
   });
  &lt;/script&gt;
  
  &lt;input TYPE="checkbox" id="chkbEnableMouseOver" &gt;enable mouseover on tabs
  
  
  &lt;div id="tabs"&gt; 
  // tabs go here
  &lt;/div&gt;
  </code></pre>