how to get table object using cssclass selector?

Question

I have an HTML page with lot of tables. Among that I have a table with the following format

<table><tr><td class="myclass">..</td></tr>
<tr><td class="myclass">..</td></tr></table>

How can I get the object of this table using the class selector in jquery?

Answer 1

You'd get the table using $('table') or the table cells using $('table td.myClass').

If you want to get the table based on the class of its cells, you'd use $('table').has('td.myClass').

Answer 2

var mytable = $('td.myclass').parent().parent();

or

var mytable = $('td.myclass:parent').parent();

Answer 3

You won't get the table object with this structure using a class selector. If you want to apply a class selector on a table object then you have to give the table a class name.

<table class="tblclass"><tr><td class="myclass">..</td></tr>
<tr><td class="myclass">..</td></tr></table>

and CSS

table.tblclass 
{
}

The below one is not a class selector for the table but it will find the table closest to the td element with class name myclass.

$("td.myclass").closest("table");

Answer 4

You need to use the parents() method. This allows you to traverse up the DOM tree. You can pass the method a selector to filter results.

 $("td.myclass").parents("table");

In my opinion, this is the neatest way of achieving what you need. The documentation is here: http://api.jquery.com/parents/