How to Add a New div Between Two Elements in an HTML Template Using JQurey

Adding a new element between two already existing elements in a template file using Javascript and JQuery. This method can be used for editing templates without directly editing theme in SCA websites. This method can be used in extensions.

HTML code:

<div class="elem">Elem 1</div>
<div class="elem">Elem 2</div>

Javascript + jQuery:

$(document).ready( function () {
   $('.elem + .elem').before($('<div class="new">New Elem</div>'));
});

Output:

Elem 1

New Elem

Elem 2