<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg">
  <rect id="red" width="100" height="100" fill="green" />
  <text id="text" x="10" y="120"></text>
  <script type="text/javascript">
  <![CDATA[
    var green = document.getElementById('green');
    // Note the use of createElement instead of createElementNS
    var red = document.createElement("rect");
    // HTML5 says createElement should lowercase the name and create it in the
    // xhtml namespace. This means the created element is not an SVG element
    // and therefore can't be appended to a SVG element.
    green.setAttribute("width", "100");
    green.setAttribute("height", "100");
    green.setAttribute("fill", "red");
    green.ownerDocument.rootElement.appendChild(red);
    document.getElementById('text').textContent = "namespace of created rect: " + green.namespaceURI;
  ]]>
  </script>
</svg>