Question

I read an article of how to hide a column using JQuery. That has got me to use the below code:

<script type="text/javascript">
    $(document).ready(function () {
        $('#<%= btnHideColumn.ClientID %>').click(function () {
            $('td:nth-child(1)').hide();
        });
    });
</script>

Although this works I would eventually have two tables under this AJAX Accordion Pane. How could I target a certain table and hide the column as required?

My table is generated in code behind. So not sure which properties would need to be filled beforehand.

Answer 1

You should also specify table in your cell selector, e.g.:

$('table:eq(0) td:nth-child(1)').hide(); // table:eq(0) selects first table

or

$('table#list td:nth-child(1)').hide(); // table#list selects table with id="list"