JQuery Select Contain Specific Text

From CoderLearner
Jump to: navigation, search

Use the contains() keyword to find a specific word or sentence

The $.contains() is used for finding text within the element.

Example 1

  • Select all element contains a specific text.
  • In this example, selected all the DIV element contains the text "is".
<html>
	<head>
		<title>Contains</title>
		<script type="text/javascript" src="jquery.min.js">
		</script>
		<script type="text/javascript" language="javascript">
			$(document).ready(function() {
				$('div:contains("is")').css('color','blue');
			});
		</script>
	</head>
	<body>
		<div>God is great!</div>
		<div>he goes to USA!</div>
		<div>Nothing is important!</div>
	</body>
</html>

Example 2

<!DOCTYPE html>
<html>
   <head>
      <title>Contain</title>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <script 
         type="text/javascript" 
         src="/lib/jquery-1.7.2.min.js">				 
      </script>
      <script language="javascript">
         $(document).ready(function(){
            $('div:contains("coderlearner")').css("text-decoration","underline");
         });
      </script>
   </head>
   <body>
      <div>TODO write content</div>
      <div>coderlearner.com</div>
      <div>Learn step by step jQuery @ coderlearner.com</div>
      <div>Apple Mini Ipad</div>
   </body>
</html>

Try It

<seo metagenerator="jquery tutorial" title="Jquery/Ajax" metakeywords="jquery greater,jquery gt, jquery lt, less then, odd jquery,jquery find element, even jquery,jquery event, jquery mouse click, jquery double click, jquery hover, jquery string, jquery array, jquery button, jquery attriubtes" metadescription="jquery button, jquery attriubte, jquery example, jquery tutorial, jquery sample"/>