The after() method is an inbuilt function in jQuery which is used to insert content, specified by the parameter for each selected element in the set of matched elements.
Syntax:
$(selector).after(A);
Parameter: It accepts a parameter "A" which is either a content or function passed to the method.
Return Value: It returns the selected element with the modification.
Example 1: In the below example, element is passing to the method which will get added after the selected element.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src=
"https://code.jquery.com/jquery-1.10.2.js">
</script>
<style>
p {
background: lightgreen;
display: block;
width: 150px;
padding: 10px;
border: 2px solid green;
}
</style>
</head>
<body>
<p>I would like to say: </p>
<script>
$("p").after("<b><h2>Hello Geeks</h2></b>");
</script>
</body>
</html>
Output:
Example 2: In the below code, the function is passed to the method that will work after the selected element.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src=
"https://code.jquery.com/jquery-1.10.2.js">
</script>
<style>
p {
background: lightgreen;
width: 250px;
padding: 10px;
border: 2px solid green;
}
</style>
</head>
<body>
<p>This is first paragraph !!!</p>
<p>This is the second paragraph !!! </p>
<script>
$("p").after(function () {
return "<div>" + "GeeksforGeeks" + "</div>";
});
</script>
</body>
</html>
Output:
