 <p>The selector needs to be <code>circle:nth-child(3)</code> -- the <code>child</code> means that the element is the nth child, not to select the nth child of the element (see <a href="http://www.w3schools.com/cssref/sel_nth-child.asp">here</a>).</p> <p>You could also use:</p> <p><div class="snippet" data-lang="js" data-hide="false"> <div class="snippet-code"> <pre class="snippet-code-js lang-js prettyprint-override"><code> // JS var data=[ 1,2,3,4,5,6,7,8,9 ]; var svg = d3.select("body").append("svg"); var circles = svg.append("g").attr("id", "groupOfCircles") .selectAll("circle") .data(data) .enter().append("circle") .attr("cx", function(d){ return d*20;}) .attr("cy", function(d){ return d*10;}) .attr("r" , function(d){ return d;}) .attr("fill","green"); d3.select("circle:nth-child(3)").attr("fill","red"); // &lt;== CSS selector (DOM) d3.select(circles[0][4]).attr("fill","blue"); // &lt;== D3 selector (node)</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"&gt;&lt;/script&gt;</code></pre> </div> </div> </p>