How do I select elements which have property color:lightGreen in CSS using jQuery and then change it to #666?

Example Html:

<a id="ctl00_ContentPlaceHolder1_GridView1_ctl17___ID_DetailsHyperLink" 
    class="CorporateHyperlink" 
     href="/EstimateSite/Estimate/Details.aspx?ID=234"
     style="color:LightGreen;">Details</a>

How do I select elements which have property color:lightGreen in CSS using jQuery and then change it to #666?

Example Html:

<a id="ctl00_ContentPlaceHolder1_GridView1_ctl17___ID_DetailsHyperLink" 
    class="CorporateHyperlink" 
     href="/EstimateSite/Estimate/Details.aspx?ID=234"
     style="color:LightGreen;">Details</a>

• javascript
• jquery
• html
• css

Share Improve this question Follow edited May 29, 2012 at 16:48 Mathew Thompson 56.4k1515 gold badges129129 silver badges150150 bronze badges asked May 18, 2012 at 11:08 MaxRecursionMaxRecursion 4,9011212 gold badges4444 silver badges7777 bronze badges 3

• What type of elements are they? Can you post some HTML? – Mathew Thompson Commented May 18, 2012 at 11:09
• @AkshayKulkarni look at my answer just change $("p") to $("a") then it will apply to all anchor elements ... – Code Spy Commented May 18, 2012 at 11:56
• The devil's in the details... literally in this case. ;) – Jagd Commented Jul 23, 2012 at 22:11

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

$("a").each(function() {
    if ($(this).css("color") == "rgb(144, 238, 144)") {
        $(this).css("color", "#666");
    }
});

Or if you prefer using filter:

$("a").filter(function() {return $(this).css('color') == 'rgb(144, 238, 144)';})
.css("color", "#666");

BUT if you had the opportunity to edit the markup, you're best off adding the light green colour to a class, then applying the class to those elements, then you can have another class for your new colour, then change them like so:

$(".lightGreen").removeClass("lightGreen").addClass("newColour");

Try this:

$("div").each(function() {
    if ($(this).css("color") == "rgb(144, 238, 144)") {
        $(this).css("color", "#666");
    }
});

http://jsfiddle/z8Q5K/2/

It's working fine...

$("a").each(function() {
    if ($(this).css("color") == "rgb(144, 238, 144)") { 
        $(this).css("color", "#666");
    }
});