title: Remove jQuery plugin without reloading content
body: <p>Say I have two different functionalities/filters (e.g. calculation and sorting) in form of plugins for a table. The user can choose which one he wants to use right now. But both together have conflicts and therefore when one is chosen, the other should be stopped/removed (without reloading the table itself). How can I achieve that?</p>
  
  <p>For example I use the <code>dataTable</code> jQuery plugin which is initialized by </p>
  
  <p><code>$('#myTable').dataTable();</code></p>
  
  <p>But when the user chooses a different filter, I somehow need to 'deactivate' this plugin for the other filter to work without conflict. I tried the <code>unbind</code> event handler, but without success.</p>
  
  <p>In general the logic would look like this:</p>
  
  <pre><code>$('.js_trigger').on('click', '.calculation' function() {
      //Deactivate
      $('#myTable').dataTable();
      //Activate
      $('#myTable').dataCalculation();
  }
  
  $('.js_trigger').on('click', '.sorting' function() {
      //Deactivate
      $('#myTable').dataCalculation();
      //Activate
      $('#myTable').dataTable();
  }
  </code></pre>
  
  <p>I hope you get what I mean and that this question is not to broad.</p>
  
  <p><strong>Solution:</strong></p>
  
  <p>With the hint of @V31, I made use of the <code>empty()</code> function.</p>
  
  <p>1.) On page load I put all the content from the table in a variable before any additional scripts change the table.</p>
  
  <pre><code>tableContent = $('#myTableContainer').html();
  </code></pre>
  
  <p>2.) When a different plugin needs to be loaded I empty the container and add the content of the variable before I execute the plugin.</p>
  
  <pre><code>$('#myTableContainer').empty();
  $('#myTableContainer').html(tableContent);
  $('#myTable').dataTable();
  </code></pre>