Javascript text on a newline D3 Viz?

Question

I am trying to make a collapsable tree and have the role below the name. I tried adding in <br> and new line character but its not working. Right now it's just Name : Role and I want Role under name?

 nodeEnter.append("text")
      .attr("x", function(d) { return d.children || d._children ? -10 : 10; })
      .attr("dy", ".35em")
      .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
       //HERE
      .text(function(d) { return d.name + ": " + d.role})
      .style("fill-opacity", 1e-6);