title: bootstrap tab causing jQuery events to disappear?
body: <p>This may be a vague question. I have a page with 3 tabs using bootstrap's tabs. Within the tab's contents there are click events. Some jQuery, some using knockout's click binding, and one using onclick. When I first go to any tab everything works fine. When I leave that tab to go to another tab and then return, none of the click events work anymore except the one made with onclick. At first I thought it was knockout causing something to go haywire, but I commented out the knockout code and it still happens. The events are pretty basic:</p>
  
  <pre><code>$('#prodSalesTable').on('click', 'td.control', function (e) {
      ....
  }
  </code></pre>
  
  <p>Here's the tab init code. Again, basic.</p>
  
  <pre><code>$('#productDetailTabs a').click(function (e) {
     e.preventDefault();
     $(this).tab('show');
  });
  </code></pre>
  
  <p>Tab code:</p>
  
  <pre><code>&lt;ul id="productDetailTabs" class="nav nav-tabs" data-tabs="tabs"&gt;
      &lt;li class="active"&gt;&lt;a data-target="#informationTab" data-toggle="tab"&gt;
          INFORMATION&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="#vocTab" data-toggle="tab"&gt;
          VOC&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="#htsCountrySpecTab" data-toggle="tab"&gt;
          TARIFF CODE&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div class="tab-content"&gt;
          &lt;section id="informationTab" class="tab-pane active"&gt;....&lt;/section&gt;
          &lt;section id="vocTab" class="tab-pane"&gt;....&lt;/section&gt;
          &lt;section id="htsCountrySpecTab" class="tab-pane"&gt;....&lt;/section&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Any ideas?</p>