title: Create anchor tag within unordered list elements with d3js?
body: <p>I wanted to dynamically create anchor tags within an undordered list:</p>
  
  <p>Mannually this works:</p>
  
  <pre><code>&lt;h2&gt;
  Without d3
  &lt;/h2&gt;
    &lt;ul id="anotherList"&gt;
      &lt;li&gt;
        &lt;a href="http://www.google.com"&gt;
        &lt;text&gt;hello&lt;/text&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href="http://www.google.com"&gt;
        &lt;text&gt;hello&lt;/text&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href="http://www.google.com"&gt;
        &lt;text&gt;hello&lt;/text&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href="http://www.google.com"&gt;
        &lt;text&gt;hello&lt;/text&gt;&lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href="http://www.google.com"&gt;
        &lt;text&gt;hello&lt;/text&gt;&lt;/a&gt;
      &lt;/li&gt;
  
    &lt;/ul&gt;
  </code></pre>
  
  <p>So, the HTML structure built by d3 should look like the example above. My d3 code looks like this:</p>
  
  <pre><code>var data = [1,2,3,4,5];
  
  d3.select("#divListElement")
  .selectAll("li")
  .data(data)
  .enter()
  .append("li")
    .append("a")
    .attr("xlink:href", "http://www.google.de")
    .append("text")
        .text("hello");
  </code></pre>
  
  <p>When I inspect the DOM structure of both, I see that they are indeed the same. However the example without d3 (manually created) works, while the example with d3 does not work, even though it's the same structure? </p>
  
  <p><a href="http://jsfiddle.net/thadeuszlay/Qh9X5/9211/" rel="nofollow">http://jsfiddle.net/thadeuszlay/Qh9X5/9211/</a></p>