jQuery if H1:contains a word do something

Question

I've used the contains()function successfully, but never have used it with an if-statement. My below code doesn't seem to work when it should. I am basically saying if H1 contains the word "true", do something, if not do something else. Currently it only shows the first bit of code no matter what is in the H1.. it never shows the else part.

<H1>This h1 contains the word Star</H1>

if ($("H1:contains('True')")) {
    var test= "<div>IT DID CONTAIN THE WORD TRUE!</div>";
    $('h1').append(test);

} else {
    var test= "<div>IT DID <b>NOT</b> CONTAIN THE WORD TRUE!</div>";
    $('h1').append(test);                     
}

possible duplicate of [if contains certain text, then run jquery](http://stackoverflow.com/questions/6309870/if-contains-certain-text-then-run-jquery) — Matt Ball, Jun 17 '11 at 15:09

score 9 · Accepted Answer · answered Jun 17 '11 at 15:04

9

You need to check the length property of the resulting collection:

if ($("H1:contains('True')").length) {
    ...

Since $("H1:contains('True')") will return an object and objects always evaluate to truthy.

answered Jun 17 '11 at 15:04

karim79

339,989
67
413
406

lol duh, thank you very much I've been looking at the code to long =p – ToddN Jun 17 '11 at 15:06

score 1 · Answer 2 · answered Jun 17 '11 at 15:04

1

$("H1:contains('True')") is a selector. It returns a jQuery object, not a boolean. To check that the selector found any objects, check the length property:

if ($("H1:contains('True')").length) {
    // stuff...
}

answered Jun 17 '11 at 15:04

Matt Ball

354,903
100
647
710

score 0 · Answer 3 · answered Jun 17 '11 at 15:05

0

try this

if ($("H1:contains('True')").length > 0) {
   var test= "<div>IT DID CONTAIN THE WORD TRUE!</div>";
   $('h1').append(test);                     
} else {
   var test= "<div>IT DID <b>NOT</b> CONTAIN THE WORD TRUE!</div>";
   $('h1').append(test);                     
}

answered Jun 17 '11 at 15:05

Dave

532
5
8

The test would either be `> 0` or `>= 1`. – Matt Ball Jun 17 '11 at 15:06

score 0 · Answer 4 · edited May 23 '17 at 12:08

0

With the contains, it gives back a list.

Refer to this for a solution:

if contains certain text, then run jquery

edited May 23 '17 at 12:08

Community

1
1

answered Jun 17 '11 at 15:06

dev4life

880
2
8
18

score 0 · Answer 5 · answered Jun 17 '11 at 15:10

The problem is that $("H1:contains('True')") always returns true because it is always an object. What you really want to check is if it contains elements.

if ($("H1:contains('True')").length) {

Now it will return the else part.

Note: I believe that :contains is case-sensitive.

jQuery if H1:contains a word do something

5 Answers5