Multiple tables in html have the same id selector and one of them needs to be hidden on click

Question

I have multiple tables with the same id and I want to hide a particular table when it is clicked. Please suggest me about how to do it.

add different class names to each of your tables and access them using selectors! — Sunny Sharma, Mar 11 '14 at 05:11
You are suggesting a bad practice here, ID should be unique not classes. — Matúš Dúbrava, Mar 11 '14 at 05:15
possible duplicate of [Does ID have to be unique in the whole page?](http://stackoverflow.com/questions/9454645/does-id-have-to-be-unique-in-the-whole-page) — Tushar Gupta - curioustushar, Mar 11 '14 at 05:17

score 2 · Answer 1 · answered Mar 11 '14 at 05:09

2

id is unique, you need to use class instead, then you can do:

$('.classOfYourTables').click(function() {
    $(this).hide();
});

answered Mar 11 '14 at 05:09

Felix

Pratik Joshi · Accepted Answer · 2014-03-11T05:23:37.280

Always use unique ID ,its the best practice,classes are not Unique classTable=> class given to all tables And the id for each table is Unique .

<script>
$(".classTable").click(function() {

    var tblId=$(this).attr("id");
    alert(tblId);
    $("#"+tblId).hide();
});
</script>

on any table User clicks , Get id of the current Table class which is clicked.And hide only those class by taking its ID ,As IDs are unique

2 Answers2