title: tablesorter grabbing original data after my dropdown filter
body: <p>I have a table with a few rows in it that is sortable using tablesorter.</p>
  
  <pre><code>&lt;tbody id='filterTicket_body'&gt;
   &lt;tr&gt;&lt;td&gt;Field 1 Row 1&lt;/td&gt;&lt;td&gt;Field 2 Row 1&lt;/td&gt;&lt;td&gt;Field 3 Row 1&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;Field 1 Row 2&lt;/td&gt;&lt;td&gt;Field 2 Row 2&lt;/td&gt;&lt;td&gt;Field 3 Row 2&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;Field 1 Row 3&lt;/td&gt;&lt;td&gt;Field 2 Row 3&lt;/td&gt;&lt;td&gt;Field 3 Row 3&lt;/td&gt;&lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>On the same page i have a dropdown that user can filter rows. that drop down fires an ajax call to db to get only results based on filter. I clear the #filterTicket_body and then replace it with results.</p>
  
  <pre><code>        $('body').on('change','#ticketFilter',function(){
              var val = $(this).val();
              $('#filterTicket_body').html('');
              $.ajax({
                      type:"POST",
                      url:"support/ticketFilter.php",
                      data:"filter="+val,
                      success:function(result){
                              $('#filterTicket_body').html(result);
                      }
              });
  
      });
  </code></pre>
  
  <p>An example of result would just be a table row.</p>
  
  <pre><code> &lt;tr&gt;&lt;td&gt;Field 1 Row 2&lt;/td&gt;&lt;td&gt;Field 2 Row 2&lt;/td&gt;&lt;td&gt;Field 3 Row 3&lt;/td&gt;&lt;/tR&gt;
  </code></pre>
  
  <p>Lets assume the user selected "Row 2".  This filter would replace #filterTicket_body with 1 row of data. So far so good.</p>
  
  <p>Now, when a user clicks on table header to sort, using default tablesorter,  the original 3 rows of data are prepended to the results. so I end up with</p>
  
  <pre><code>Row 2
  Row 1
  Row 2
  Row 3
  </code></pre>
  
  <p>any thoughts?</p>