title: colResizable on dynamic table not working
body: <p>I have a dynamic table which user can add rows or columns, I also use <strong>colResizable</strong> to make it flexible for user to be able to resize columns. While I added this plugin it does not work for new created cells.<br>
  This is my source</p>
  
  <pre><code>$(document).ready(function() {
     $( "#container table" ).colResizable({ liveDrag : true });
     //... Other stuffs
  }
  </code></pre>
  
  <p>This function to create column</p>
  
  <pre><code>function insert_column(element, position)
  {
     element.parent().parent().find('tr').each(function() {
        var index = 0;
        $(this).find('td').each(function() {
           if (index == position)
           {
               $(this).after('&lt;td&gt;&amp;nbsp;&lt;/td&gt;');
           }
           index++;
        });
     });
     $( "#container table" ).colResizable({ liveDrag : true });
  }
  </code></pre>
  
  <p>If you want may think it's because of some CSS, this is the only CSS I have for <code>#container</code> and tables inside</p>
  
  <pre><code>#container {
      float: left;
      width:800px;
      height:100%;
      overflow:hidden;
      padding: 7px;
      border: 2px #BBB dashed;
  }
  #container table {
      width: 100%;
      table-layout: fixed;
      background-color:#FCFCFC;
  }
  #container td {
      border-spacing: 2px;
      min-height: 17px;
      min-width: 50px;
      border: 1px #CCC dotted;
  }
  </code></pre>
  
  <p>The weird part is that if I comment or remove the <code>colResizable</code> it works for adding columns but if I enable it adds the columns but not visible and cannot be resized.<br>
  Any help will be appreciated.</p>