JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>
<div class="body">
    <div class="content">
        <div class="chart" id="chartId" />
    </div>
</div>

CSS

.chart div {
  background-color: steelblue;
  padding: 3px;
  margin: 1px;
  height: 10px;
}

JavaScript

var data = [4, 8, 15, 16, 23, 42];

function newDiv() {
    return document.createElement("div");
}
 
var chart = {
    appendChild: function (child) {
        // эта функция будет вызвана из append() после newDiv()
        return document.getElementById("chartId")
            .appendChild(child);
    },
    querySelectorAll: function () {
        // эта функция будет вызвана из selectAll()
        return [];
    }
}
 
d3.select( chart )
  .selectAll()
    .data(data)
  .enter().append( newDiv )
    .style("width", function(d) { return d * 10 + "px"; });