Для чего используется .insertAfter() в jQuery?

Перемещает элементы набора jQuery, вставляя их после элементов, определяемых с помощью входного параметра.

.insertAfter() в jQuery

Категории: Manipulation › DOM Insertion, Outside

Перемещает элементы набора jQuery, вставляя их после элементов, определяемых с помощью входного параметра.

Добавлено в jQuery 1.0.insertAfter( target )
Метод .insertAfter() вставляет каждый элемент набора jQuery сразу после указанной цели target. По записи он противоположен методу .after(): у .after() первым указывается то, что остаётся на месте, а вставляемое содержимое передаётся аргументом; у .insertAfter() наоборот — набор, который перемещается, стоит перед вызовом метода, а цель передаётся аргументом. Итоговый DOM в обоих случаях получается одинаковым.
target может быть селектором, HTML-строкой, DOM-элементом, массивом элементов или объектом jQuery.

Возвращаемое значение: (объект) Набор jQuery — исходные (перемещённые) или клонированные элементы на новом месте.

target – (строка | элемент | массив | объект jQuery) место, после которого вставляются элементы набора.

Примечание:
Если target соответствует одному месту в документе, элементы набора физически перемещаются туда, а не клонируются, — если элемент уже был где-то в DOM, оттуда он исчезнет.
Примечание:
Если target соответствует нескольким элементам, после последнего из них вставляется сам оригинал, а после остальных — его клоны (как .clone(true), вместе с данными и обработчиками); возвращённый набор включает оригинал и все клоны.
В jQuery 3.x и 4.0:
Метод не менялся, работает без изменений в 3.7.1 и 4.0. Нативный аналог для одной цели — target.after(node) (Element.after(), поддерживается всеми современными браузерами), но он не клонирует узел автоматически при нескольких целях — это придётся делать вручную через node.cloneNode(true).

Переместить существующий блок сразу после заголовка страницы.
```
$('#promo-banner').insertAfter('#page-title');
```
Вставить новый элемент после каждого элемента, подходящего под селектор (клонирование).
```
$('<hr class="divider">').insertAfter('.section');
```

Нативный аналог для одной цели.

var banner = document.querySelector('#promo-banner');
document.querySelector('#page-title').after(banner);