JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/resources/dojo.css">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dijit/themes/claro/claro.css">
<body class="claro">
    <div id="selectPlaceHolder"></div>
        <div id="filteredPlaceHolder"></div>

    
</body>

JavaScript

require([
    "dojo/ready", "dojo/store/Memory", "dijit/form/Select", "dijit/form/FilteringSelect"
], function(ready, Memory, Select, FilteringSelect){
    var stateStore = new Memory({
        data: [
            {name:"Alabama", id:"AL"},
            {name:"Alaska", id:"AK"},
            {name:"American Samoa", id:"AS"},
            {name:"Arizona", id:"AZ"},
            {name:"Arkansas", id:"AR"},
            {name:"Armed Forces Europe", id:"AE"},
            {name:"Armed Forces Pacific", id:"AP"},
            {name:"Armed Forces the Americas", id:"AA"},
            {name:"California", id:"CA"},
            {name:"Colorado", id:"CO"},
            {name:"Connecticut", id:"CT"},
            {name:"Delaware", id:"DE"}
        ]
    });

    ready(function(){
        var normalSelect = new Select({ 
            id: "stateSelect1",
            name: "state1"
        }, 'selectPlaceHolder');
        dojo.forEach(stateStore.data, function(item) {
            // convert each option to label/value pair
            normalSelect.addOption({value: item.id, label: item.name});
        });
        var filteringSelect = new FilteringSelect({
            id: "stateSelect2",
            name: "state2",
            value: "CA", // initially sets another option then index 0
            store: stateStore,
            searchAttr: "name"  // notify select, that this is the 'human readable' attribute
        }, "filteredPlaceHolder");
        
        setTimeout(function() {
            normalSelect.set("value", "CA");
           filteringSelect.set("value", "AK"); // sets option on timeout
        },200);
    });
});