Question

After an AJAX query, a XML file is returned. I’m able to “parse” that file, but when it comes to getting the “innerHTML” (or in this case “innerXML”) of an element, the issue arises.

If the XML element, let’s say “content”, only contained text I could do: content.childNodes[0].nodeValue (assuming that content references the XML element “content”). But that element contains other elements:

<stackoverflow reason="tribute to this page">
   <content>
      <div><span><p>Some more HTML elements</p></span></div>
   </content>
</stackoverflow>

I need to copy the content of <content> to an existing <div> in the page, how could I do that?

Ex. myDiv.innerHTML = content.innerHTML;

Answer 1

innerHTML is a hack you should not use at all. Instead, use the normal DOM functions:

myDiv.appendChild(document.adoptNode(content));