title: jQuery tablesorter refusing to working after many attempts
body: <p>my jquery tablesorter plugin has just refused to work no matter what I do. I have tried downgrading my version of jquery amongst other things but still nothing.</p>
  
  <p>I'm building the table from my js file with data from an external json file.</p>
  
  <p>Here's what my HTML looks like.</p>
  
  <pre><code>&lt;div class="table-responsive"&gt;
              &lt;table id="myTable" class="tablesorter"&gt;
                  &lt;thead&gt;
                      &lt;tr&gt;
                          &lt;th&gt;A&lt;/th&gt;
                          &lt;th&gt;B&lt;/th&gt;
                          &lt;th&gt;DATE &amp; TIME&lt;/th&gt;
                          &lt;th&gt;C&lt;/th&gt;
                          &lt;th&gt;D&lt;/th&gt;
                          &lt;th&gt;&lt;button&gt;View &lt;/button&gt;&lt;/th&gt;
                      &lt;/tr&gt;
                  &lt;/thead&gt;
                  &lt;tbody&gt;
                  &lt;/tbody&gt;
              &lt;/table&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Here are my imported scripts</p>
  
  <pre><code>&lt;!-- jQuery library --&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;!-- Bootstrap --&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;        
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.jsdelivr.net/respond/1.4.2/respond.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdn.jsdelivr.net/selectivizr/1.0.3b/selectivizr.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="Vendors/js/jquery.tablesorter.js"&gt;&lt;/script&gt; 
  &lt;script type="text/javascript" src="Vendors/js/jquery.tablesorter.min.js"&gt;&lt;/script&gt; 
  &lt;script src="Resources/js/main.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>And my js where I build the table and call tablesorter</p>
  
  <pre><code>var tr;
      for (var i = 0; i &lt; json.length - 30; i++) {
          tr = $('&lt;tr/&gt;');
          tr.append("&lt;td&gt;" + json[i].name + "&lt;/td&gt;");
          tr.append("&lt;td&gt;" + json[i].summary + "&lt;/td&gt;");
          tr.append("&lt;td&gt;" + formatDate(json[i].time) + "&lt;/td&gt;");
          tr.append("&lt;td " + "class= text-center&gt;" + json[i].size + "&lt;/td&gt;");
          tr.append("&lt;td " + "class= text-center&gt;" + json[i].id + ', ' + json[i].id + "&lt;/td&gt;");
          $('tbody').append(tr);
      }
  </code></pre>
  
  <p>I don't believe the fact that I'm building the table from jQuery is why I'm having this problem. I even tried creating a new table with html only but that didn't work.</p>
  
  <p>This is how I call the tablesorter with jquery</p>
  
  <pre><code>$("#myTable").tablesorter({
          sortList: [[2,0], [3,1]]
      }); 
  </code></pre>
  
  <p>Any help would be greatly appreciated.</p>
  
  <p>THANK YOU</p>