Вставить родственный узел в JS

Итак, у меня есть div с некоторыми предварительными тегами, например так:

<div id="editor" >
    <pre contentEditable="true">1</pre>
    <pre contentEditable="true">2</pre>
    <pre contentEditable="true">3</pre>
</div>

Теперь я хочу использовать Javascript, чтобы поместить новый предварительный узел между 1 и 2. Я пытался сделать это таким образом (поскольку я понимаю, что DOM - это двусвязное дерево), но у меня возникает ощущение, что, возможно, указатели не редактируются, как я ' м приближается к нему.

(просто фрагмент внутри обработчика событий, e - событие)

var tag = e.srcElement;
    if(tag.nextSibling){
        var next = tag.nextSibling;
        var newPre = document.createElement('pre');
        newPre.setAttribute("contentEditable", "true");
        newPre.innerHTML = "boom";
        tag.nextSibling = newPre;
        newPre.nextSibling = next;
    }

Эти последние две строки взяты из моего опыта работы с C ++, но они кажутся неприятными в JS. Как мне установить новый родственный узел?