Roch Roch - 24 days ago 6
jQuery Question

JQuery select an element inside a td

I would like to select an element inside the td of one of my tables but I don't really understand the syntax.
This is what I tried:

$("table > td:#box")


This is a sample of my table structure:

<div id="main">
<div id="today">
<table id="list" width="100%" cellpadding="4" cellspacing="0" border="0" style="font-size: 10px; border-collapse:collapse;">
<tr id="109008">
<td class="tdstd">
<a class="box" href="link"></a>
</td>


Or With Chrome's DOM inspector:

alt text

Answer

Well, "#box" means a DOM object with the id "box", as in it being a unique ID. You can select that one directly. But your code suggest that you have several elements with the id "box" which you have to change. You should assign a class to your element inside the TD, or if it's unique by being the only DIV or SPAN in the box, you can access it like this:

$("table td .box")

Note that the ">" selector means that TD has to be a direct child of TABLE, and I'm assuming you have at least a TR level in between, so that won't work either. My example above matches every element with the class "box" inside any TD that is a child to any TABLE.

Obviously I would set a class on the table as well, and use something like this:

$("table.boxes td .box")

Just so you don't accidentally selects things outside the scope you want to work in.


You have now added HTML so I'm editing my answer:

$("table#list a.box")