title: How to get a table column index in JavaScript knowing its class?
body: <p>I want to hide/show table columns </p>
  
  <ul>
  <li>using classes on columns,</li>
  <li>without adding classes to each <code>&lt;td&gt;</code></li>
  </ul>
  
  <p>Table sample:</p>
  
  <pre><code>&lt;table id="huge-table" border="1"&gt;
      &lt;caption&gt;A huge table&lt;/caption&gt;
  
      &lt;colgroup&gt;
          &lt;col class="table-0"&gt;
          &lt;col class="table-0"&gt;
          &lt;col class="table-1"&gt;
          &lt;col class="table-1"&gt;
      &lt;/colgroup&gt;
  
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;h1&lt;/th&gt;
              &lt;th&gt;h2&lt;/th&gt;
              &lt;th&gt;h3&lt;/th&gt;
              &lt;th&gt;h4&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td&gt;1,1&lt;/td&gt;
              &lt;td&gt;1,2&lt;/td&gt;
              &lt;td&gt;1,3&lt;/td&gt;
              &lt;td&gt;1,4&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;2,1&lt;/td&gt;
              &lt;td&gt;2,2&lt;/td&gt;
              &lt;td&gt;2,3&lt;/td&gt;
              &lt;td&gt;2,4&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Unfortunately <code>$(".table-1").hide()</code> doesn't work. </p>
  
  <p>So I would like to get columns indexes by class and to use them with the <code>nth-child</code> selector: </p>
  
  <pre><code>indexes = getColumnIndexesByClass("table-1");
  for ( var i=0; i&lt;indexes.length; i++ ) {
      $('#huge-table td:nth-child(indexes[i])').hide();
  }
  </code></pre>
  
  <p><strong>How can I implement the <code>getColumnIndexesByClass</code> function or any other equivalent solution?</strong></p>
  
  <h2>EDIT</h2>
  
  <p>The table size is not known. I know only the classes. </p>