title: Hide / toggle specific column jQuery
body: <p>I have a table of tables in HTML. And what I want to do is toggle specific columns.
  The goal is that the user can select which columns to display.</p>
  <p>This is my table (simplified):</p>
  <pre><code>  &lt;table id=&quot;mainview&quot; class=&quot;table table-striped table-bordered&quot;&gt;
      &lt;th&gt;Column1&lt;/th&gt;
      &lt;th&gt;Column2&lt;/th&gt;
      &lt;th&gt;Column3&lt;/th&gt;
      &lt;tr&gt;
        &lt;td&gt;
          &lt;table class=&quot;table table-bordered&quot;&gt;
          &lt;tr&gt;
            &lt;th&gt;One&lt;/th&gt;
            &lt;th&gt;Two&lt;/th&gt;
            &lt;th&gt;Three&lt;/th&gt;
           &lt;/tr&gt;
           &lt;tr&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
           &lt;/tr&gt;
          &lt;/table&gt;
        &lt;/td&gt;
        &lt;td&gt;
          &lt;table class=&quot;table table-bordered&quot;&gt;
          &lt;tr&gt;
            &lt;th&gt;One&lt;/th&gt;
            &lt;th&gt;Two&lt;/th&gt;
            &lt;th&gt;Three&lt;/th&gt;
           &lt;/tr&gt;
           &lt;tr&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
           &lt;/tr&gt;
          &lt;/table&gt;
        &lt;/td&gt;
        &lt;td&gt;
          &lt;table class=&quot;table table-bordered&quot;&gt;
          &lt;tr&gt;
            &lt;th&gt;One&lt;/th&gt;
            &lt;th&gt;Two&lt;/th&gt;
            &lt;th&gt;Three&lt;/th&gt;
           &lt;/tr&gt;
           &lt;tr&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
             &lt;td&gt;text&lt;/td&gt;
           &lt;/tr&gt;
          &lt;/table&gt;
        &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/table&gt;
  </code></pre>
  <p>I have this input for the moment to choose which column to toggle:</p>
  <pre><code>&lt;input id=&quot;number&quot; value=&quot;2&quot;&gt;
  &lt;button id=&quot;toggle&quot;&gt;Toggle&lt;/button&gt;`
  </code></pre>
  <p>And this is my script:</p>
  <pre><code>function fire() {
      var v = $('#number').val() || 0;
      $('#mainview tr').closest(':nth-child('+v+')').toggle();
  }
  $('#toggle').click(fire);
  </code></pre>
  <p>My problem is, when I want to toggle a columns, it also affect all the nth columns of each secondary table. How can I only select the parent columns?</p>