JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>
<div id="d3-chart">
</div>
<div id="answer"></div>

CSS

#answer{ color: green; }

JavaScript

var dataset = [
        ["A","4","570"],
        ["B","19","123"],
        ["C","10","395"],
    ];

//dataset.sort( d3.descending );
      
d3.select("#d3-chart").selectAll("div")
    .data(dataset)
    .enter()
    .append("div")
    .attr("class", "d3-item")
    .attr("data-bar-1", function (d) {return d[1];})
    .attr("data-bar-2", function (d) {return d[2];})
    .attr("data-text", function (d) {return d[0];})
;

$("div.d3-item").each(function() {
    var text = $(this).attr('data-text'),
        v1 = $(this).attr('data-bar-1'),
        v2 = $(this).attr('data-bar-2');
    $(this).append(text+': '+v1+' ('+v2+')');
});

//Sort
function on_first(a,b){
    return a[1]-b[1]; 
}
$("#answer").html( dataset.sort(on_first).join("<br/>") );