jQuery if "this" contains

Chris picture Chris · Jan 24, 2013 · Viewed 85.9k times · Source

I'm trying to change any elements containing a particular text string to a red color. In my example I can get the child elements to become blue, but there's something about the way I've written the 'Replace Me' line that is incorrect; the red color change doesn't happen. I note that the "contains" method is usually written as :contains but I couldn't get that to validate with $(this).

$('#main-content-panel .entry').each(function() {
       $(this).css('color', 'blue');      
});         

$('#main-content-panel .entry').each(function() {
   if($(this).contains("Replace Me").length > 0) {
        $(this).css('color', 'red'); 
    }      
});

Fiddle: http://jsfiddle.net/zatHH/

Answer

jkozera picture jkozera · Jan 24, 2013

:contains is a selector. To check if a selector applies to given variable, you can use is:

if($(this).is(':contains("Replace Me")')) 

However Vega's solution is cleaner in this case.