How to insert a DOM element after all paragraphs using jQuery ?
In this article, we will insert a DOM element after all paragraph elements using jQuery. To insert a DOM element we use after() and createTextNode() methods. The createTextNode() method is used to create a TextNode which contains an element node and a text node. It is used to provide text to an element. The after() method is used to insert the specified content after each selected element.
Syntax:
$( selector ).after( content );
Example:
HTML
<!DOCTYPE html><html> <head> <!-- Import jQuery from CDN library --> <script src= </script> <script> $(document).ready(function () { $("button").click(function () { $("p").after(document .createTextNode("Hello World!")); }); }); </script></head> <body style="text-align: center;"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> How to insert a DOM element after all paragraphs using jQuery? </h3> <p> GeeksforGeeks computer science portal </p> <button>Click Here!</button></body> </html> |
Output:
Before clicking the button:
After clicking the button:
Please Login to comment...