Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

How to select all links inside the paragraph using jQuery ?

  • Last Updated : 06 Sep, 2021

In this article, we will see how to write code to select all links inside the paragraph using jQuery. To select all links inside paragraph element, we use parent descendant selector. This selector is used to selects every element that are descendant to a specific (parent) element.

Syntax:

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.

$("parent descendant")

Approach: Here, we have created links and content inside paragraph element. After that, we use $(“p a”) selector to select all links inside paragraph element and changes its style using css() method.



 

Example:

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>
        jQuery code to select all 
        links inside the paragraph
    </title>
  
    <script src=
    </script>
  
    <style>
        body {
            text-align: center;
            font-size: 30px;
        }
          
        button {
            background-color: green;
            color: white;
            border: none;
            font-size: 24px;
            border-radius: 5px;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
        }
          
        a {
            text-decoration: none;
        }
    </style>
  
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $("p a").css({
                    color: "white",
                    background: "green"
                });
            });
        });
    </script>
</head>
  
<body>
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
  
    <h3>
        jQuery code to select all 
        links inside the paragraph
    </h3>
  
    <p>
        <a href="#">GeeksforGeeks</a> is a 
        computer science <br>portal where 
        you can learn <a href="#">HTML</a>,
        <a href="#">CSS</a>, <br><a href="#">
        JavaScript</a>, etc.
    </p>
  
    <button>
        Click Here
    </button>
</body>
  
</html>

Output:




My Personal Notes arrow_drop_up
Recommended Articles
Page :