JSFiddle - React, Tailwind, and code Playground

by sspboyd

HTML

<script src="http://d3js.org/d3.v2.js"></script>
<div id="horse" />

JavaScript

var xStat = "A";

var statOptions = {
    "Points": "PTS",
    "Goals": "G",
    "Assists": "A",
    "Penalty Minutes": "PIM"
};

var selectUI = d3.select("#horse").append("form").append("select");

selectUI.selectAll("option").data(d3.keys(statOptions)).enter().append("option").text(function(d) {
    return d;
});

selectUI.selectAll("option").data(d3.values(statOptions)).attr("value", function(d) {
    return d;
});

    var checkOption = function (e) {
        if(e === xStat){
            return d3.select(this).attr("selected", "selected");
        }
    };
    
    selectUI.selectAll("option").each(checkOption);