Hide Table Column v2
HTML
<table id="tableone" border="1">
<thead>
<tr>
<th>One<input id="chkHide" type="checkbox"/></th>
<th>Two</th>
<th>Three</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Column 1</td>
<td>Row 1 Column 2</td>
<td>Row 1 Column 3</td>
</tr>
<tr>
<td>Row 2 Column 1</td>
<td>Row 2 Column 2</td>
<td>Row 2 Column 3</td>
</tr>
<tr>
<td>Row 3 Column 1</td>
<td>Row 3 Column 2</td>
<td>Row 3 Column 3</td>
</tr>
<tr>
<td>Row 4 Column 1</td>
<td>Row 4 Column 2</td>
<td>Row 4 Column 3</td>
</tr>
<tr>
<td>Row 5 Column 1</td>
<td>Row 5 Column 2</td>
<td>Row 5 Column 3</td>
</tr>
</tbody>
</table>
<label><input id="chkHide" type="checkbox"/> Toggle Column 2</label>
<br/>
<input id="btnHide" type="button" value="Toggle Column 2"/>
<table id="tableone" border="1">
<thead>
<tr>
<th>One<input id="chkHide" type="checkbox"/></th>
<th>Two</th>
<th>Three</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Column 1</td>
<td>Row 1 Column 2</td>
<td>Row 1 Column 3</td>
</tr>
<tr>
<td>Row 2 Column 1</td>
<td>Row 2 Column 2</td>
<td>Row 2 Column 3</td>
</tr>
<tr>
<td>Row 3 Column 1</td>
<td>Row 3 Column 2</td>
<td>Row 3 Column 3</td>
</tr>
<tr>
<td>Row 4 Column 1</td>
<td>Row 4 Column 2</td>
<td>Row 4 Column 3</td>
</tr>
<tr>
<td>Row 5 Column 1</td>
<td>Row 5 Column 2</td>
<td>Row 5 Column 3</td>
</tr>
</tbody>
</table>
<label><input id="chkHide" type="checkbox"/> Toggle Column 2</label>
<br/>
<input id="btnHide" type="button" value="Toggle Column 2"/>
JavaScript
$(document).ready(function() {
$('#btnHide').click(function() {
//$('td:nth-child(2)').toggle();
// if your table has header(th), use this
$('td:nth-child(2),th:nth-child(2)').toggle();
});
$('#chkHide').click(function() {
$('td:nth-child(2),th:nth-child(2)').toggle();
});
});