Adding labels to groups in d3 force layout

Question

Is there a way to add labels to the groups for the d3-cola force layout example here

I have added tooltips:

var group = svg.selectAll(".group")
    .data(groups)
    .enter().append("rect")
    .classed("group", true)
    .attr("rx",20)
    .attr("ry",20)
    .style("fill", function (d) { return color(d.id); })
    .call(cola.drag);

group.append("title")
    .text(function (d) { return d.id; });

I tried adding this part:

var groupText = svg.selectAll(".group")
    .append("text")
    .attr("class", "link-label")
    .attr("font-family", "Arial, Helvetica, sans-serif")
    .attr("fill", "Black")
    .style("font", "normal 9px Arial")
    .attr("dy", ".35em")
    .attr("text-anchor", "middle")
    .text(function(d) {
      return (d.id);
    });

And then in the tick function:

groupText
    .attr("x", function(d) {
        return ((d.bounds.x + d.bounds.width())/2);
    })
    .attr("y", function(d) {
        return ((d.bounds.y + d.bounds.height())/2);
    });

But it doesn't show up.