Jquery: Checking to see if div contains text, then action
I'm trying to check in jQuery if a div contains some text, and then add a class if it does.
So I wrote something like this:
if( $("#field > div.field-item").text().indexOf('someText') = 0) {
$("#somediv").addClass("thisClass");
}
I'm not getting this to work.
<div id="field"><div class="field-item">someText</div></div>
<div id="somediv"></div>
Is this incorrect?
Solution 1:
Your code contains two problems:
- The equality operator in JavaScript is
==
, not=
. -
jQuery.text()
joins all text nodes of matched elements into a single string. If you have two successive elements, of which the first contains'some'
and the second contains'Text'
, then your code will incorrectly think that there exists an element that contains'someText'
.
I suggest the following instead:
if ($('#field > div.field-item:contains("someText")').length > 0) {
$("#somediv").addClass("thisClass");
}
Solution 2:
Yes, I now made think for me. And it works fine!!!
if($("div:contains('CONGRATULATIONS')").length)
{
$('#SignupForm').hide(500);
}
Solution 3:
if( $("#field > div.field-item").text().indexOf('someText') >= 0)
Some browsers will include whitespace, others won't. >=
is appropriate here. Otherwise equality is double equals ==
Solution 4:
Ayman is right but, you can use it like that as well :
if( $("#field > div.field-item").text().indexOf('someText') >= 0) {
$("#somediv").addClass("thisClass");
}