Somk
Somk

Reputation: 12047

jQuery selector not working for table

I am trying with jquery to add classes to only the cells with active_square already as a class. But this line never works. Is the selector wrong?

 $("table#team_a_grid > tr > td.active_square").addClass('clickable');   
   <table border='1' id="team_a_grid" style="float:left;">
     <tr>
       <td class=''></td>
        <td class=''>A</td>
        <td class=''>B</td>
        <td class=''>C</td>
        <td class=''>D</td>
        <td class=''>E</td>
        <td class='active_square'>F</td>
        <td class='active_square'>G</td>
        <td class='active_square'>H</td>
        <td class='active_square'>I</td>
        <td class='active_square'>J</td>
     </tr>
  </table>

Upvotes: 1

Views: 228

Answers (7)

Elie Andraos
Elie Andraos

Reputation: 86

place this in the of your page and you're good

<script>
$(document).ready(function(){
  $("table#team_a_grid td.active_square").addClass('clickable');
)}
</script>

Upvotes: 0

yogesh hotchandani
yogesh hotchandani

Reputation: 11

Use Code This

$('table tr td.active_square').addClass('clickable')

Upvotes: 0

Alexander G
Alexander G

Reputation: 276

Isn't it enough to just check on active_square ? Makes it general for other tables as well.

$("td.active_square").addClass('clickable');  

Upvotes: 1

Ashish Kumar
Ashish Kumar

Reputation: 3039

Find out your class within the context. This is the faster way to do this easily:

$("td.active_square", "#team_a_grid").addClass("clickable");

jsfiddle : http://jsfiddle.net/xpmTN/1/

Good luck!

Upvotes: 0

Ranjit Singh
Ranjit Singh

Reputation: 3735

Use this

$("table#team_a_grid tr td.active_square").addClass('clickable');

In jquery you can select children by giving an space between parent and children.

But the good practice we be using .find() method of jquery as

$("table#team_a_grid").find(".active_square").addClass('clickable');

Upvotes: 0

user632287
user632287

Reputation:

You can use find to find all td's in the table and add the class:

$("#team_a_grid").find("td.active_square").addClass('clickable');   

Upvotes: 1

adeneo
adeneo

Reputation: 318182

Most browsers will insert a tbody element to make the table valid

$("#team_a_grid > tbody > tr > td.active_square").addClass('clickable');   

FIDDLE

Unless you really have nested tables you're better of using

$("#team_a_grid td.active_square").addClass('clickable');   

Upvotes: 3

Related Questions