Javascript replacechild help, extra tag added to responsetext

Question

I do not want the outer div tag? how to i add my responsetext with its codes only.

This is working, but the result is not what i wanted.

var newdiv = document.createElement("div");
newdiv.innerHTML = xhr.responseText;
document.getElementById("middleright").replaceChild(newdiv, document.getElementById("moreoption"));

middleright is the parent of moreoptions. after this is executed, middleright becomes the parent of div instead of the responsetext.

i tried doing this.

document.getElementById("middleright").innerhtml += xhr.responseText;

This is what i'm looking for, but it only inserts to the end of the innerhtml, i want to insert it in the middle.

Is there any alternative? i google for days before i post this question. thankyou for helping.

---

UPDATE

there is a problem, look at this

var newdiv = document.createElement("div");
newdiv.innerHTML = xhr.responseText;
var next = document.getElementById("moreoption").nextSibling;
document.getElementById("middleright").removeChild(document.getElementById("moreoption"));
var els = newdiv.childNodes;
var len = els.length;
for (var i=0; i<5; i++) {
next.parentNode.insertBefore(els[i],next);
}

it will only output till els[2], i dont know why? but when i do this.

for (var i=5; i>0; i--) {
next.parentNode.insertBefore(els[i],next);
}

it outputs all,but in the wrong direction.

---

UPDATE

var addpoint = document.getElementById("moreoption").nextSibling;
var newdiv = document.createElement("div");
newdiv.innerHTML = xhr.responseText;
var next, el = document.getElementById("moreoption");
var parent = el.parentNode;
parent.removeChild( el );
el = newdiv.firstChild;

do {
  next = el.nextSibling
  parent.insertBefore(el,addpoint);
} while( el = next );

Answer 1

You can select the node inside the temp div element.

document.getElementById("middleright")
    .replaceChild( newdiv.firstChild, // select the root node in response text
                   document.getElementById("moreoption") );

Or you can also try responseXML intead of responseText.

---

Update

To get all the nodes in responseText you should iterate through the childNodes of newdiv.

var next, el = document.getElementById("moreoption");
var parent = el.parentNode;
parent.removeChild( el );
el = newdiv.firstChild;

do {
  next = el.nextSibling
  parent.appendChild( el );
} while( el = next );