The jQuery after() method is used to insert specified content after the selected element. It is just like jQuery append() method.
If you want to insert content before the selected element, you should use jQuery before() method.
Syntax:
$(selector).after(content,function(index))
| Parameter | Description |
|---|---|
| Content | It is a mandatory parameter. It specifies the content to insert.
Its possible values are:
|
| Function (index) | It specifies a function that returns the content which is used to insert.
|
Let's see an example of jQuery after() method:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").after("<p><b>Hello rookienerd.com</b></p>");
});
});
</script>
</head>
<body>
<button>Insert content after each p element</button>
<p>This is a tutorial website.</p>
<p>This is a training institute.</p>
</body>
</html>Output:
This is a tutorial website.
This is a training institute.
