d3.js - D3: Text element drawn last but overlapped by some other elements

Question

here is a snippet of code:

var nodeGroup = svg.selectAll("g")
                 .data(listNodes)
                 .enter()
                 .append("g")
                 .attr("id",function(d){ return "Group_" + trimWhitespace(d); })
                 .attr("transform","translate(580,260)");

visualizeNodes(nodeGroup, coordinates);
visualizeConnections(nodeGroup, listEdges, coordinateDict);
visualizeText(nodeGroup, coordinates);

I visualize the text last but it still seems to be overlapped. It's over the circles drawn by visualize Nodes, but the multiple opaque lines drawn by visualizeConnections overlap it.