CODEWITHSUNDEEP
jquerycsshtml
Arvin
Arvin

Reputation: 1014

How to select all tr having a specefic background-color inside a tbody

I have a table with certain tr having a special background-color

<table>
<tbody id="tbodyProjectList">
<tr>
<th>Name</th>
<th>Status</th> 
</tr>
<tr>
<td>wildlife</td>
<td>archived</td>
</tr>
<tr style="background-color:#4F4F4F">
<td>Xperia Z</td>
<td>archived</td>
</tr>
<tr>
<td>Manchester</td>
<td>Running</td>
</tr>
<tr>
<tr style="background-color:#4F4F4F">
<td>Restored</td>
</tr>
</tbody>
</table>

Using jquery I want to get that all tr having that color #4f4f4f. I did this code

$("#tbodyProjectList").find("tr[background-color:#404040]");

also did this too

$("#tbodyProjectList").find("tr background-color:#404040");

but not working. the object is empty. when I executed this in firebug it returns object[]

Upvotes: 0

Views: 2834

Answers (3)

yogesh hotchandani
yogesh hotchandani

Reputation: 11

You can use this code for find tr that have specific background-color

$('tr').filter(function(){ if($(this).css('background-color')=="#4F4F4F")return $(this);})

Upvotes: 0

Ram
Ram

Reputation: 144709

You are using attribute equals selector, the selector should be:

$("#tbodyProjectList").find("tr[style='background-color:#404040']");

But the selector can easily fail if you add other styles to the elements, the better here is using the .filter() method:

$("#tbodyProjectList tr").filter(function() {
    return $(this).css('background-color') === 'rgb(79, 79, 79)'; 
});

Note that you can use classes for filtering the elements, selecting the elements based on the CSS properties is a bad idea.

Upvotes: 2

Lauri Elias
Lauri Elias

Reputation: 1299

Maybe this?

$('#tbodyProjectList tr[style*=background-color:#404040]');

Upvotes: 0

Related Questions