selection.join() question

[Pavel S]

Hi,

I want to create a structure like this:

<div class="outer" ><span class="inner"></span><div>

<div class="outer" ><span class="inner"></span><div>

<div class="outer" ><span class="inner"></span><div>

etc...

I assume the following code is wrong, because the enter function does not return a selection of divs, but spans.

d3.selectAll('div')

    .data(data)

    .join(enter => enter

        .append('div')

        .classed('outer', true)

        .append('span')

        .classed('inner', true)

    )

How to fix that?