JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<tr>
<th>
column1
<input type="checkbox" checked="true" />
</th>
<th>
column2
<input type="checkbox" checked="true" />
</th>
<th>
column3
<input type="checkbox" checked="true" />
</th>
<th>
column4
<input type="checkbox" checked="true" />
</th>
<th>
column5
<input type="checkbox" checked="true" />
</th>
</tr>
<tr>
<td>
column1
</td>
<td>
column2
</td>
<td>
column3
</td>
<td>
column4
</td>
<td>
column5
</td>
</tr>
</table>
CSS
table
{
border:solid 1px red;
}
table th
{
border:solid 1px red;
}
JavaScript
$(document).ready(function(){
$('table tr input:checkbox').change(function(){
var num = $(this).parents("th").index();
if($(this).is(":checked"))
{
$('table tbody tr td').eq(num).show();
}else
{
$('table tbody tr td').eq(num).hide();
}
});
});