title: Mouseenter event only firing once for d3.js svg circle
body: <p>I would like to create multiple circles when double clicking the canvas, and then doStuff() upon entering and leaving one of the circles.</p>
  
  <p>Here is a jsfiddle with what I currently have set up: <a href="https://fiddle.jshell.net/r3ar8rc7/" rel="nofollow">https://fiddle.jshell.net/r3ar8rc7/</a></p>
  
  <p>However, when creating the circle, the mouseenter and mouseleave events are immediately fired, and then never happen again. How can I make this work?</p>