How to read/get the CSS background color of a row in a gridview

Question

I have set the background-color of a row via CSS

$("#gv tr:has(td)").each(function () {
                $(this).css({ "background-color": "green" });
})

After this , certain rows have been added

How can I loop through the rows and only again find the "green" rows?

$("#gv tr:has(td)").each(function () {
             ? (if row == green){
               }
})

FYI There's no need to do an each function to set them, just do: `$("#gv tr:has(td)").css({ "background-color": "green" });` — Derek, Apr 17 '13 at 15:51

Adil · Accepted Answer · 2013-04-17T16:21:32.023

4

Use css() to get value of background-color

$("#gv tr:has(td)").each(function () {
     if($(this).css("background-color") == "green")
     {
     }
});

You can also use the DOM object to get color

Live Demo

$("#gv tr:has(td)").each(function () {
     if(this.style.backgroundColor == "green")
     {
     }
});

edited Apr 17 '13 at 16:21

answered Apr 17 '13 at 15:51

Adil

146,340
25
209
204

returns e.g. rgb(222, 223, 222) but I can work with this ,thanks! – Peter PitLock Apr 17 '13 at 16:08
Check my updated answer to get background color value in plain format – Adil Apr 17 '13 at 16:25

George Johnston · Answer 2 · 2013-04-17T16:08:14.697

3

What if you decide to change the background-color from green?

As an alternative solution, if your application allows it, I would recommend simply adding a class to each row element that you wish to select later. This would be much more maintainable and self documenting than identifying an element by a background color. e.g.

<td class="main-class green></td>

If you added a class to the appropriate elements, then you could easily select all of your green elements by the their selector.

edited Apr 17 '13 at 16:08

answered Apr 17 '13 at 15:55

George Johnston

31,652
27
127
172

Yes, add or remove class instead of change the style inline. – Hieu Le Apr 17 '13 at 16:03

score 0 · Answer 3 · answered Apr 17 '13 at 15:52

0

Try:

if ($(this).css("background-color") === "green")

answered Apr 17 '13 at 15:52

MMM

7,221
2
24
42

score 0 · Answer 4 · answered Apr 17 '13 at 15:53

0

If($(this).css("background-color") == "green") { ... }

answered Apr 17 '13 at 15:53

How to read/get the CSS background color of a row in a gridview

4 Answers4