Hide table columns by class
<p>I have a table from n columns. Each cell has a class <code>column-n</code>.</p>

<p>I want to add on table class <code>hide-column-n</code> and hide all cells with class <code>column-n</code>.
Is this possible do it through css?</p>

<p>Example:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>.table {
    border: 1px solid black;
  }
  .table thead{
    background-color: lightgray;
  }
  .table td{
    border: 1px solid gray;
    width: 50px;
  }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table class="table"&gt;
  &lt;thead&gt;
  &lt;tr&gt;
    &lt;td class="column-1"&gt;One&lt;/td&gt;
    &lt;td class="column-2"&gt;Two&lt;/td&gt;
    &lt;td class="column-3"&gt;Three&lt;/td&gt;
    &lt;td class="column-x"&gt;...&lt;/td&gt;
    &lt;td class="column-n"&gt;N&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/thead&gt;
  &lt;tbody&gt;
  &lt;tr&gt;
    &lt;td class="column-1"&gt;One&lt;/td&gt;
    &lt;td class="column-2"&gt;Two&lt;/td&gt;
    &lt;td class="column-3"&gt;Three&lt;/td&gt;
    &lt;td class="column-x"&gt;...&lt;/td&gt;
    &lt;td class="column-n"&gt;N&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
    &lt;td class="column-1"&gt;One&lt;/td&gt;
    &lt;td class="column-2"&gt;Two&lt;/td&gt;
    &lt;td class="column-3"&gt;Three&lt;/td&gt;
    &lt;td class="column-x"&gt;...&lt;/td&gt;
    &lt;td class="column-n"&gt;N&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
    &lt;td&gt;...&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/tbody&gt;
&lt;/table&gt;</code></pre>
</div>
</div>
</p>