In IE9, Imported nodes do not seem to be recognized as SVG Elements

Question

I am adding couple of elements into the existing SVG document using the importNode() method; everything seems to be fine; could get the newly added elements using getElementsBy

Answer 1

The elements inside an xml file need to define what namespace they're in, otherwise they'll get parsed as unknown xml elements.

This is true even if the root of the xml file was an <svg> element. To make sure that the elements get parsed as proper svg elements, you should add xmlns="http://www.w3.org/2000/svg" and possibly xmlns="http://www.w3.org/1999/xlink (if you use xlink attributes anywhere in the file).

If on the other hand you parsed the elements using an html5 parser, the constraints are similar but slightly different since xmlns attributes aren't recognized in html (only in xhtml). You'd need at least an <svg> element root for the markup to get parsed as svg in such a case, and you'd need to make sure that the markup is detected as html5 (avoiding any browser-specific legacy fallback modes). So you couldn't have a <g> element as the root if you use an html5 parser.