Learn D3.js

Entering new elements

You need to create additional elements for the extra data that is in the _enter array. Calling enter() will return a selection with these elements. Let's try it:

function redraw() {     d3.select("#container")       .selectAll(".letter")           // selects the existing letters       .data(datasets[idx].split(""))  // sets new data       .style("background-color", d => colors[idx])       .text(d => d)       .enter()         // returns a selection with only the new items       .append("div")   // appends a div for each new item       .attr("class", "letter"); // sets the class of the new items }

Look at the results as follows. It's not what we expected. The rendered results don't show the extra letters, but two new elements were actually added to the DOM tree, as you can see from the ...