title: Reorder elements of SVG ( z-index ) in D3.js
body: <p>I realise this question has been asked before but I can't get to the bottom of it.</p>
  
  <p>Here is my chart... <a href="http://www.gogeye.com/financialnews/piechart/index3.html">http://www.gogeye.com/financialnews/piechart/index3.html</a></p>
  
  <p>All I want to do is have the coin render behind the graph. I know D3 renders in order they are appended.</p>
  
  <p>I have tried to re-append the coin but can't seem to get it working.</p>
  
  <p>I've tried reordering when things are appended in the DOM but keep getting errors probably because variables are getting called before being defined etc.</p>
  
  <p>Can someone give me an example of how to fix this with my code? I don't want you to do the work for me but I've been pulling my hair out for so long, I can't seem to apply other peoples examples to mine.</p>
  
  <p>thanks</p>