title: Can I load an external SVG file once, then clone copies multiple time?
body: <p>I have an application that I have created a template SVG file for, but depending on user interaction, will need to create multiple (say 6 to 20) instances of the image and modify each independently through code. I know how to load the file into an object element, and how to access and modify the elements within the image, but I'm trying to find if it is possible to do this without having to import the SVG source file for each object as it's created, or can I somehow buffer the source file as an XML structure and then copy that? My target environment is plain HTML and javascript.</p>
  <p>For reference, I need to make a navigable display of the nodes and edges of a graph describing the Tower of London cognitive assessment. I want to place an image of the balls and posts arrangement in a circle for each of the nodes and allow the user to traverse the graph. The SVG source file has the balls and posts, to represent a particular node I just change the position of the circle elements that represent the balls to move them to the appropriate post. I could brute force this by loading a new copy of the SVG template for each object representing a node but I'm hoping for a more elegant solution.</p>