title: Open a bootstrap modal with a link in d3 svg
body: <p>I have created a d3.js tree and an interface based on bootstrap. Now I want to show more information to the user when clicking on any link within the tree. The information should be showed in an already existing bootstrap modal. How the information is loaded doesn't matter so far (I think I can do it with ajax). 
  But I already fail at calling the modal to show up with a click on the link. </p>
  
  <p>Here's the code from my tree.js where the link is created:</p>
  
  <pre><code>   nodeEnter.append("svg:a")
          .attr("x", function(d) {
              return d.children || d._children ? -10 : 10;
          })      
          .attr("xlink:href", name) //this and the next line is just to give information for later ajax call
          .attr("type", type)
          .attr('data-toggle', 'modal') //this and the next line is for bs
          .attr('data-target', 'detail-modal')
      .append("text")
          .attr("dy", ".35em")
          .attr('class', 'nodeText')
          .attr("text-anchor", function(d) {
              return d.children || d._children ? "end" : "start";
          })
          .text(function(d) {
              return d.name;
          })
          .style("fill-opacity", 0);
  </code></pre>
  
  <p>This code results the following layout of each node (with the text as link):</p>
  
  <pre><code> &lt;g class="node" transform="translate(660,62.5)"&gt;
      &lt;circle class="nodeCircle" r="4.5" style="fill: rgb(255, 255, 255);&lt;/circle&gt;
  
      &lt;a x="-10" xlink:href="Malvaceae" type="plants_family" data-toggle="modal" data-target="detail-modal"&gt;
      &lt;text dy=".35em" class="nodeText" text-anchor="end" style="fill-opacity: 1;" x="-10"&gt;Malvaceae&lt;/text&gt;&lt;/a&gt;
  
      &lt;circle class="ghostCircle" r="30" opacity="0.2" style="fill: red;" pointer-events="mouseover"&gt;&lt;/circle&gt;
   &lt;/g&gt;
  </code></pre>
  
  <p>Articles here and elsewhere seem not to deal with this problem, so I suspect that I missed something to make the d3.js knowing the bootstrap commands. But I cannot find out what or how to do this.</p>
  
  <p>I would appreciate your help!</p>
  
  <p>Thanks in advance!</p>