Introduction:

  • In this article we will explain how to add specified content after the selected element. in jquery or What is insertAfter() method in jquery or why use insertAfter() method in jquery with example.

  • Description:

 

The jQuery insertAfter() method is used to add specified content after the selected element. It is just like jQuery after() method. If you want to add content before the selected element, you should use jQuery before() method.

The jQuery after() and jQuery insertAfter() both methods are used to perform the same task of adding additional contents after the selected elements.


Syntax:

  • $(content).insertAfter(selector);


  • Example of jQuery insertAfter() method


Let's take an example to demonstrate jQuery insertAfter() Method.

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("button").click(function () {                $("<span><b>Join sqltutorialspoint.com</b></span>").insertAfter("p");
            });
        });
    </script>
</head>
<body>
    <button>add span element after each p element</button>
    <p>This is a sql tutorials website.</p>
    <p>This is a sql tutorials institute.</p>
</body>
</html>  

Output:

how to add text after the selected element in jquery


In above example when we click on button box "<p><b>sqltutorialspoint.com.com</b></p>"


insert
after each of the paragraph.

 

I hope this article will help to you.

 

0 comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

You may also like