This tutorial will show you how we can create combobox using jQuery. We will also alert the value when we select the item from the combobox or dropdown.

<script src="">
<script type="text/javascript">
    $(document).ready(function() {
        //create a variable which holds key/value pairs
        var data = { 'Country0': 'India', 'Country1': 'Sri Lanka', 'Country2': 'USA', 'Country3': 'Australia', 'Country4': 'Newzeland'};
        //create a variable that holds select tag with an id="combo", you can also put 'class' attribute instead of combo
        var s = $('<select id="combo" />');
        //iterate through each key/value in 'data' and create an option tag out of it
        for(var val in data) {
            $('<option />', {value: val, text: data[val]}).appendTo(s);
        //clicking on the button will display the combobox or dropdown - clicking on the
        //button it will append the dropdown to a paragraph
        $("#addCombo").on('click', function() {
        //when we select an item from dropdown or combobox then alert that value
        $(document).on('change',"#combo", function(){
    <button id="addCombo">Add Combo</button>


Dynamic Combobox using jQuery

Thanks for reading.