[Solved]-D3.js: Text is not showing inside a circle(They are on the same level of an element-group). How do I bring the text to the front?-d3.js

You forgot to set the x and y positions of the text elements:

//text to show
elementGroup.append("text")
    .attr("text-anchor", "middle")
    .attr("x", function(d,i){return i*80+40;}
    .attr("y", h/2)     
    .text(function(d) {
        return parseInt(d);
     })
    .classed('tweet-number', true);

Here is your CodePen: http://codepen.io/anon/pen/mOyrMM

The <g> element wrap its content and autosize according to the contents, but it doesn't position the contents.

That being said, an alternative is using translate to the groups, and not setting any position for the texts or the circles:

elementGroup.attr("transform", function(d,i){
    return "translate(" + (i*80+40) + "," + h/2 + ")"; 
});

The result is the same, check the CodePen: http://codepen.io/anon/pen/yVyVYy