16

I need to run a jquery only if the bold element contains particular text. What am I doing wrong?

 <script>
 if ($('b:contains('Choose a sub category:')')) {

 $("td.colors_backgroundneutral").css("background-color","transparent");
 $("td.colors_backgroundneutral").children(':first-child').attr("cellpadding","0");
 };
 </script>
skaffman
  • 398,947
  • 96
  • 818
  • 769
user764728
  • 339
  • 1
  • 3
  • 12
  • 4
    use double quotes ("") inside the single quotes ('') ...you're using single quotes inside single quotes which is breaking the string. – Thomas Shields Jun 10 '11 at 17:55

3 Answers3

28

Besides using single quotes inside single quotes, which breaks the string, you're using a jQuery selector inside an if statement. This selector only filters your b tags to those which contain "Choose a sub category"; and then returns a list of those elements. It does not return a boolean. Instead, use the .contains() method, like so:

if($("b").contains("Choose a sub category")) {
   // do stuff 
}

You can read more here

EDIT: since the .contains() method appears to be deprecated, here's a pure JS solution:

var el = document.getElementById("yourTagId") // or something like document.getElementsByTagName("b")[0] if you don't want to add an ID.
if (el.innerHTML.indexOf("Choose a sub category") !== -1) {
    // do stuff
}
Thomas Shields
  • 8,874
  • 5
  • 42
  • 77
  • 4
    Unfortunately it seems this `jQuery().contains` method no longer exists, or at least all my attempts to use it trigger an error of `no such function call`. `jQuery.contains` exists, but that is for use specifically with DOM elements, and not strings of text. Personally I'd much rather use a method call than construct a `:contains` selector, so it's rather annoying if jQuery have removed this. – Pebbl Jan 05 '15 at 08:31
  • @Pebbl this is the problem with jQuery. Far better to roll native JS here, as it's only a few lines longer. – Thomas Shields Jun 12 '15 at 17:05
  • If this solution ever worked for text it no longer does as per [this documentation](https://api.jquery.com/jQuery.contains/) and the answer should therefore no longer be marked as correct. ovahernow's solution does work for text as required by the question. – Luke Aug 06 '15 at 12:54
  • I know this is old, but since I stumbled onto this through a web search, others might as well. `$.contains` has, as far as I know, never worked for text strings. However, the `:contains` selector [does](https://api.jquery.com/contains-selector/). – Tijmen Aug 14 '17 at 09:23
17

I have always used this to determine if an element exists:

if ($('b:contains("Choose a sub category:")').length > 0) { /*do things*/}
dev4life
  • 880
  • 2
  • 8
  • 18
  • 1
    I'm not sure why I was downvoted since this was the recommended way to check for existing elements: http://stackoverflow.com/questions/4592493/jquery-check-if-element-exists – dev4life Jun 10 '11 at 18:08
  • 1
    me neither; I believe the downvoter just didn't see it as ideal as there's a jQuery `.contains()` method dedicated to this particular situation. Remember, OP doesn't want to check if it exists, he just wants to see if the bold tag contains text. While both our solutions work, mine is just a tad more semantically correct. :) I upvoted you though. :) – Thomas Shields Jun 10 '11 at 18:25
  • Thanks Tom. I would go with yours as well. I just wanted to fix his existing code. I have upvoted yours as well. – dev4life Jun 10 '11 at 18:27
4
 if ($("b").has(":contains('Choose a sub category:')").length) { 
 /*Your Stuff Here*/
 }
BTC
  • 3,802
  • 5
  • 26
  • 39