title: Uncaught NotFoundError: Failed to execute 'appendChild' on 'Node': The new child element is null
body: <p>I get weird issue after trying to display xml data through xsl on html. when I compile the html file on my desktop, no issue shows up. However, when I upload these files to my server and compile the html file, I get this error message on Opera latest version: "<strong>Uncaught NotFoundError: Failed to execute 'appendChild' on 'Node': The new child element is null</strong>"</p>
  
  <p>I also get similar issue when run that on FF says "<strong>NS_ERROR_ILLEGAL_VALUE: Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIXSLTProcessor.importStylesheet]</strong>". </p>
  
  <p>it is exact same code from w3school I'm using, but surprisingly this issue on my side happening...</p>
  
  <p>you can find the code <a href="http://www.w3schools.com/xsl/xsl_client.asp" rel="nofollow">The full code XSLT - On the Client</a> </p>
  
  <p>The xml file::</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;catalog&gt;
    &lt;cd&gt;
      &lt;title&gt;Empire Burlesque&lt;/title&gt;
      &lt;artist&gt;Bob Dylan&lt;/artist&gt;
      &lt;country&gt;USA&lt;/country&gt;
      &lt;company&gt;Columbia&lt;/company&gt;
      &lt;price&gt;10.90&lt;/price&gt;
      &lt;year&gt;1985&lt;/year&gt;
    &lt;/cd&gt;
  .
  .
  &lt;/catalog&gt; 
  </code></pre>
  
  <p>The xsl file::</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;xsl:stylesheet version="1.0"
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"&gt;
  
  &lt;xsl:template match="/"&gt;
    &lt;html&gt;
    &lt;body&gt;
    &lt;h2&gt;My CD Collection&lt;/h2&gt;
    &lt;table border="1"&gt;
      &lt;tr bgcolor="#9acd32"&gt;
        &lt;th style="text-align:left"&gt;Title&lt;/th&gt;
        &lt;th style="text-align:left"&gt;Artist&lt;/th&gt;
      &lt;/tr&gt;
      &lt;xsl:for-each select="catalog/cd"&gt;
      &lt;tr&gt;
        &lt;td&gt;&lt;xsl:value-of select="title" /&gt;&lt;/td&gt;
        &lt;td&gt;&lt;xsl:value-of select="artist" /&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;/xsl:for-each&gt;
    &lt;/table&gt;
    &lt;/body&gt;
    &lt;/html&gt;
  &lt;/xsl:template&gt;
  
  &lt;/xsl:stylesheet&gt;
  </code></pre>
  
  <p>The html file::</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script&gt;
  function loadXMLDoc(filename)
  {
  if (window.ActiveXObject)
    {
    xhttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
  else
    {
    xhttp = new XMLHttpRequest();
    }
  xhttp.open("GET", filename, false);
  try {xhttp.responseType = "msxml-document"} catch(err) {} // Helping IE11
  xhttp.send("");
  return xhttp.responseXML;
  }
  
  function displayResult()
  {
  xml = loadXMLDoc("cdcatalog.xml");
  xsl = loadXMLDoc("cdcatalog.xsl");
  // code for IE
  if (window.ActiveXObject || xhttp.responseType == "msxml-document")
    {
    ex = xml.transformNode(xsl);
    document.getElementById("example").innerHTML = ex;
    }
  // code for Chrome, Firefox, Opera, etc.
  else if (document.implementation &amp;&amp; document.implementation.createDocument)
    {
    xsltProcessor = new XSLTProcessor();
    xsltProcessor.importStylesheet(xsl);
    resultDocument = xsltProcessor.transformToFragment(xml, document);
    document.getElementById("example").appendChild(resultDocument);
    }
  }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body onload="displayResult()"&gt;
  &lt;div id="example" /&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>any idea why such none sense errors are showing up on these browsers... The issue is also on other browsers and this is just an example where I keep testing..</p>