title: How can I re-create a table's contents with jQuery?
body: <p>I want to refresh the contents in my Table dynamically. This code here only initiates but does not reload the table. </p>
  
  <p>Contents are stored in "data" object and its values come from a rest call. This works without any problem.</p>
  
  <p>The problem I am having is when I load a different 'data' myDataGrid() function does not work for the second time. How can I refresh it? Should I destroy the object somehow?</p>
  
  <p>This is from the main js code:</p>
  
  <pre><code>$('#DataTables_Table_1_wrapper').html("");
  
  $('table[data-table-name="dt-testCells"]').myDataGrid({
      'aoColumns': cols,
      'aaData': data
  });
  </code></pre>
  
  <p>Creation of the table:</p>
  
  <pre><code>MyDataGrid.prototype = {
  
  constructor: MyDataGrid,
  
  init: function(type, element, options) {
    this.type = type;
    this.$element = $(element);
    this.name = this.$element.data('table-name');
    this.settings = this.getOptions(options);
  
    this.createTable(options);
  },
  createTable: function(options) {
    // Init the datatable
    this.$table = this.$element.dataTable(this.settings);
  
    // Row Selection
    this.$table.on('click', 'tbody tr', $.proxy(this.clicked, this));
  
  }
  </code></pre>