Как добавить блок содержимого div между двумя другими div, используя только javascript?

Question

Я пытаюсь добавить DIV как ниже

 <div id="topheader" class="topheader"> 
      <ul> 
       <li> 
        <a href="#" title="Library">Library</a> 
       </li> 
       <li> 
        <a href="#" title="My Uni">My Uni</a> 
       </li> 
       <li> 
        <a href="#" title="Staff Intranet">Staff Intranet</a> 
       </li> 
      </ul> 
     </div> 

между двумя другими дивами

<div id="w3"> 
.... new div to be here ... 
<div id="head"> 

Мне нужно, чтобы это сделать с помощью JavaScript или motools и не JQuery.

Answer 1

Вы можете сделать это с помощью inject

var headEle = document.id('head'); 

new Element('div', { 
    "class": 'topheader', 
    "id": 'topheader', 
    html: '<ul><li><a href="#" title="Library">Library</a></li><li><a href="#" title="My Uni">My Uni</a></li><li><a href="#" title="Staff Intranet">Staff Intranet</a></li></ul>' 
}).inject(headEle, 'before'); 

Вот рабочая JS FIDDLE

Answer 2

var div_before = document.getElementById("w3"); 
var new_div = document.getElementById("topheader"); 
div_before.parentNode.insertBefore(new_div, div_before.nextSibling); 

jsfiddle DEMO