CODEWITHSUNDEEP
javascriptjquery
Jeff
Jeff

Reputation: 1800

li.toUpperCase():not selector difficulties

I have some code that looks something like this:

$('.myList li:not(:contains(' + myWord + '))').css({'color' : red' });

When called, this will turn everything that doesn't contain my keyword red.

However, this is not a case insensitive search. To make it so, I've tried something like this:

$('.myList li.'+toUpperCase()+':not(:contains(' + myWord.toUpperCase() + '))').css({'color' : 'red' });

But that just throws errors.

How can I do a :not(:contains search that is case insensitive?

Upvotes: 0

Views: 67

Answers (2)

elclanrs
elclanrs

Reputation: 94101

I suggest you do it with filter instead, it's more concise:

$('.myList li').filter(function() {
  return !new RegExp(myWord, 'i').test($(this).text());
}).css('color', 'red');

You can remove the i flag if you want it to be case-sensitive.

Upvotes: 2

David Thomas
David Thomas

Reputation: 253318

I'd suggest a simpler approach:

$('.myList li').filter(function(){
    // I may have become lost in your approach, but the following
    // will filter the list to those nodes that *do not* contain
    // text equal to that contained in the myWord variable
    var text = $(this).text().toLowerCase();
    return text.indexOf(myWord.toLowerCase()) == -1;
}).css('color', red);

Note that:

$('.myList li.'+toUpperCase()+':not(:contains(' + myWord.toUpperCase() + '))').css({'color' : 'red' });

You seem to be searching for a list item with a class-name equal to the upperCase() function (which won't happen), and then you're looking to force the :contains() selector to be case-insensitive, which you've already found it isn't.

Upvotes: 2

Related Questions