How to Make jQuery Insert After Target: Add Content After Elements

jQuery Insert After: Main Tips

• The .insertAfter() jQuery method adds content after the specified elements.
• .insertAfter() differs from .after() since the new content is added as a selector expression.

Usage of .insertAfter()

The .insertAfter() jQuery function includes new content after the indicated elements. The following example adds new content after the <div> element:

$("button").click(() => {
    $("<h1>Hello world!</h1>").insertAfter("div");
});

Follow this syntax to use the jQuery insert after method:

$(content).insertAfter(target);

jQuery .insertAfter() method accepts two arguments:

• content represents the HTML elements or tags to insert.
• target indicates after which elements should new content be added. It can be defined in either a selector, or a jQuery object, HTML string, element, or an array of them.

Tip: use jQuery .insertBefore() method to add content before specified elements.