Is there an easy way to clear an SVG element's contents?

Question

In HTML, I can clear a <div> element with this command:

div.innerHTML = ""; 

Is there an equivalent if I have an <svg> element? I can't find an innerHTML nor innerXML or even innerSVG method.

I know the SVG DOM is a superset of the XML DOM, so I know I can do something like this:

while (svg.lastChild) {     svg.removeChild(svg.lastChild); } 

But this is both tedious and slow. Is there a faster or easier way to clear an SVG element?

Answer 1

If you're using jQuery, you can just do

$("#svgid").empty(); 

This deletes all child elements of the svg while leaving its other attributes like width and height intact.