insertAfter multiple elements in jQuery

Question

var group1 = $('#coach-group-group1');
var group2Title = $('#title-group2').clone();
group2Title.remove();
var group2 = $('#coach-group-group2').clone();
group2.remove();
$(group2, group2Title).insertAfter(group1);

.. doesn't seem to work, it only inserts first of the two elements provided, not the second, and there are no errors in the console either.

How do I insert multiple elements, in order, one after the other using insertAfter ?

Answer 1

$(group2, group2Title) doesn't create a set of two DOM elements. The second argument is usually the context in which the first argument is evaluated, but if the first argument is not a selector, then the second argument is simply ignored.

It seems you are looking for .add :

group2.add(group2Title).inserAfter(...);

DEMO

But I think your intentions would be clearer if you used .after :

group1.after(group2, group2Title);

---

FWIW, it doesn't make sense to call .remove on those elements because they are not in the document.