Então eu tenho uma div com algumas tags pré, assim:

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

Agora eu quero usar Javascript para colocar um novopre nó entre 1 e 2. Eu tenho tentado fazê-lo desta maneira (desde que eu entendo que o DOM é uma árvore duplamente vinculada), mas estou tendo a sensação de que talvez os ponteiros não sejam editáveis quando estou me aproximando isto

(apenas um snippet dentro de um manipulador de eventos,e sendo o evento)

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;
    }

Essas duas últimas linhas são da minha experiência em c ++, mas me sinto mal em JS. Como eu definiria um novo nó irmão?