.join(
  enter => enter.append("text")
      .attr("fill", "green")
      .attr("x", (d, i) => i * 16)
      .attr("y", -10)
      .text(d => d)
    .call(enter => enter.transition(t)
      .attr("y", 20)),
  update => update
      .attr("fill", "black")
      .attr("y", 20)
    .call(update => update.transition(t)
      .attr("x", (d, i) => i * 16)),
  exit => exit
      .attr("fill", "brown")
    .call(exit => exit.transition(t)
      .attr("y", 50)
      .remove())
)


  const data = randomLetters().map((d, i) => [d, i, d3.schemeCategory10[Math.floor(10*Math.random)]]);
  const bla = svg.selectAll("g")
    .data(data, d => d[0])
  	.join(enter => enter.append("g"),
         	update => update,
         	exit => exit.attr("fill", "brown")
        		.call(exit => exit.transition(t)
          		.attr("transform", "translate(0,50)")
          		.remove()));
  
  bla.select("text")
  	.data(d => d)
  	.join(
      enter => enter.append("text")
          .attr("fill", "green")
    			.attr("x", d => d[1] * 16)
          .attr("y", -10)
          .text(d => d[0])
        .call(enter => enter.transition(t)
          .attr("y", 20)),
      update => update
          .attr("fill", "black")
          .attr("y", 20)
        .call(update => update.transition(t)
          .attr("x", d => d[1] * 16))
    );
    
    
    
  bla.select("text")
    .data(d => d)
  	.join(
      enter => enter.append("text")
          .attr("fill", "green")
          .attr("x", d => d[1] * 16)
          .attr("y", -10)
          .text(d => d[0])
        .call(enter => enter.transition(t)
          .attr("y", 20))
    );