CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
user1000744
user1000744

Reputation: 123

jquery :contain multiple selection

I am facing some bad time while trying to select an anchor with content 'type' and 'size'.

I have a list:

<ul>
<li><a>type</a></li>
<li><a>size</a></li>
<li><a>size type</a></li>
<li><a>type</a></li>
<li><a>type size</a></li>
</ul>

What I need to do is to select all anchors with content "Type & Size"

I did select the anchors with content Type, I still need to concatenate the selection for more than once selction

$("li a:contains("type")").closest('li').css({"border","2px solid green"});

How can I do both?

Upvotes: 1

Views: 30

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1075567

To search for both "type" and "size", you can add a second :contains:

$("li a:contains('type'):contains('size')").closest('li').css("border","2px solid green");

Two other issues with your code fixed above:

  1. Also mind your quotes. If the string is using ", use ' within it.

  2. You had { and }, but you weren't giving a valid object initializer. For the above, you don't need an object, just two arguments. But if you were using an object (which is also valid), you'd need a : between the property name and value, e.g {"border": "2px solid green"}.

Live Example:

$("li a:contains('type'):contains('size')").closest('li').css("border","2px solid green");
<ul>
  <li><a>This has type</a></li>
  <li><a>This has size</a></li>
  <li><a>This has type and size</a></li>
  <li><a>This has neither</a></li>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Upvotes: 2

Related Questions