JSFiddle - React, Tailwind, and code Playground

by iMaverick

HTML

<div id="myDiv">

</div>

JavaScript

var json = {
    "items": {
        "itemID1":{
            "price": "100",
            "name": "itemName1"
        },
        "itemID2":{
            "id": "2",
            "price": "200",
            "name": "itemName2"
        },
        "itemID3":{
            "id": "3",
            "price": "300",
            "name": "itemName3"
        }
    
        }};
        
        var selectElement = $("<select />",{id:"mySelect"});
        
        for (var item in json.items){
            var optionElement = $("<option />",{id:json.items[item],text:json.items[item].name,defaultPrice:json.items[item].price
        });
            selectElement.append(optionElement);
        }


$("#myDiv").append(selectElement);

$("#mySelect").on('change',function(){
    alert("Price of "+$(this).val().attr('id')+" is - "+$(this).attr("defaultPrice"));
});