Appending div to circle in d3.js (use of tspan)

http://stackoverflow.com/questions/23030063/appending-div-to-circle-in-d3-js

HTML

<script src="http://d3js.org/d3.v3.js"></script>
<div id="cities"></div>

JavaScript

data = 	[
        { ID: 1, Name: 'John', City: 'http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page1.svg' },
        { ID: 2, Name: 'Jane', City: 'http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page2.svg' },
        { ID: 3, Name: 'Michelle', City: 'http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page1.svg' },
        { ID: 4, Name: 'James', City: 'http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page2.svg' },
        { ID: 5, Name: 'Tom', City: 'http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page1.svg' },
    ];
      
      var width = 400,
		      height = 400;

		  var svg = d3.select("body").append("svg")
		      .attr("width", width)
		      .attr("height", height);

		 var g = svg.append("g");


     var img = g.append("svg:image")
     .data(data)
     .attr("xlink:href", "http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page1.svg")
    .attr("width", width/2)
    .attr("height", height/2)
    .attr("x", 20)
    .attr("y",20);

    var rechts = g.append("rect")
    .attr("width", width/4)
    .attr("height", height)
    .attr("x", 20 + width/4)
    .attr("y",20)
    .style("opacity", 0)
    .on('click',function(d){
    
 
  function count(d) {
                  return 1;
                }
   var text = g.append("svg:text")
    .attr("x", width - 150)
    .attr("y", function(d, i){ return i *  20 + 40;})
    .text(function (d) {
    return count;
    });
   // d3.select(this).attr("xlink:href", "http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page2.svg");
   img.attr("transform", function(d){
   
    var img = g.append("svg:image")
     .attr("xlink:href", "http://berlin.onesty-tech24.de:1004/Visio/AFA_news_page2.svg")
		 .attr("width", width/2)
     .attr("height", height/2)
     .attr("x", 20)
     .attr("y",20);
   });
    });