jQuery – Contains selector example

jQuery contains(text) selector is used to select all elements that are contains specified text.

Examples
1. $(‘p:contains(paragraph 1)’) – selects all elements matched by <p> that contains the text “paragraph 1”.
2. $(‘p:contains(mkyong)’) – selects all elements matched by <p> that contains the text “mkyong”.
3. $(‘li:contains(three)’) – selects all elements matched by <li> that contains the text “three”.

Play It

Click on the buttons to play around the contains selectors.


<html>
<head>
<title>jQuery contains selector example</title>
 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

<style type="text/css">
	#msg{
		padding:8px;
		hright:100px;
	}
</style>
</head>

<body>

<h1>jQuery contains selector example</h1>

<div id="msg"></div>

<ul>
	<li>One</li>
	<li>two</li>
	<li>three</li>
	<li>four</li>
	<li>five</li>
</ul>

<p>
	This is a paragraph 1 - google.com
</p>

<p>
	This is a paragraph 2 - mkyong.com
</p>

<br/><br/>
<button>p:contains(paragraph 1)</button>
<button>p:contains(mkyong)</button>
<button>li:contains(three)</button>

<script type="text/javascript">
    $("button").click(function () {
		
	  var str = $(this).text();	
	  $('p, li').css("border", "0px solid #000000");
	  $(str).css("border", "1px solid #ff0000");
	  $('#msg').html("<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-format="fluid"
     data-ad-layout="in-article"
     data-ad-client="ca-pub-2836379775501347"
     data-ad-slot="6894224149"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script><h2>Button clicked : " + str + "</h2>");
    });
	
</script>

</body>
</html>

About the Author

author image
mkyong
Founder of Mkyong.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
sekhar Recent comment authors
newest oldest most voted
sekhar
Guest
sekhar

Please provide examples on ajax functions also…..