Filter elements out of a jquery object based on text content

dom, dom-manipulation, javascript, jquery, jquery-selectors

Solution

Is this what you are looking for?

Fiddle

$(function () {
    $('ul').find('li').filter(function () {
        return this.innerHTML == 'two';
    }).css('color','red')
})

Or to match it anywhere in the element (rather than only "two" being within it):

Fiddle

$(function () {
    $('ul').find('li').filter(function () {
        return /two/.test(this.innerHTML);
    }).css('color','red')
})

Also, if it matters... chaining methods (`.find().filter()`) seems to be faster than using `contains`:

Performance test created for this specifically Another related test

And your id's should be unique - but I'm assuming that it is just copy/pasting for sample code and that you don't actually have duplicate id's in your actual code.

Problem

I am trying to use `contains` with 'this' keyword, but it is giving an error. JS ``` $(function(){ var check=$('ul').find('li').filter(function(){ return $(this:contains('two')).css('color','red') }) }) ``` HTML ``` <ul> <li id="one">one</li> <li id="two">two</li> <li id="one">one</li> <li id="two">two</li> <li id="one">one</li> <li id="two">two</li> <li id="one">one</li> <li id="two">two</li> <li id="one">one</li> <li id="two">two</li> </ul> ```

Original source