Смежная вставка элементов на JavaScript

Дан элемент:

<div id="elem" style="border: 1px solid red;"> <p>text</p> <p>text</p> <p>text</p> </div>

Вставьте перед ним абзац с текстом '!!!'.

Дан элемент:

<div id="elem" style="border: 1px solid red;"> <p>text</p> <p>text</p> <p>text</p> </div>

Вставьте после него абзац с текстом '!!!'.

Дан элемент:

<div id="elem" style="border: 1px solid red;"> <p>text</p> <p>text</p> <p>text</p> </div>

Вставьте ему в начало абзац с текстом '!!!'.

Дан элемент:

<div id="elem" style="border: 1px solid red;"> <p>text</p> <p>text</p> <p>text</p> </div>

Вставьте ему в конец абзац с текстом '!!!'.

Смежная вставка тегов

Дан элемент:

<div id="elem" style="border: 1px solid red;"> <p>text</p> <p>text</p> <p>text</p> </div>

Дан элемент. Вставьте перед ним следующий тег:

<div class="www"><p>text</p><p>text</p><input></div>