Skip to content
Related Articles

Related Articles

Improve Article

jQuery | :contains() Selector

  • Last Updated : 27 Feb, 2019

The :contains() selector in jQuery is used to select elements containing the specified string.

Syntax:

$(":contains(text)")

Parameters: This selector contains single parameter text which is mandatory and used to specify the text to find.

Example 1: This example uses :contains() selector to select element.




<!DOCTYPE html>
<html>
   <head>
      <title>jQuery :contains() Selector</title>
        
      <script src=
      </script>
        
      <!-- Script to use :contains selector -->
      <script>
         $(document).ready(function(){
           $("h3:contains(is)").css("background-color", "green");
         });
      </script>
   </head>
     
   <body>
      <center>
         <h1 id="geeks1" style = "color:green;">GeeksForGeeks</h1>
         <h2 id="geeks2">jQuery :contains() Selector</h2>
         <h3>Who is your favourite Geek:</h3>
           
         <div id="choose">
             <h3>Geek 1</h3>
             <h3>Geek 2</h3>
             <h3>Geek 3</h3>
         </div>
      </center>
   </body>
</html>

Output:

Example 2: This example use :contains() selector to select element.




<!DOCTYPE html>
<html>
   <head>
      <title>jQuery :contains() Selector</title>
        
      <script src=
      </script>
        
      <!-- Script to use :contains selector -->
      <script>
         $(document).ready(function(){
           $("h3:contains(Geek)").css("background-color", "green");
         });
      </script>
   </head>
   <body>
      <center>
         <h1 id="geeks1" style = "color:green;">GeeksForGeeks</h1>
         <h2 id="geeks2">jQuery :contains() Selector</h2>
         <h3>Who is your favourite candidate:</h3>
           
         <div id="choose">
             <h3>Geek 1</h3>
             <h3>Geek 2</h3>
             <h3>Geek 3</h3>
         </div>
      </center>
   </body>
</html>

Output:




My Personal Notes arrow_drop_up
Recommended Articles
Page :