JSFiddle - React, Tailwind, and code Playground

HTML

<form method="post">
    State: <select name="state" id="state">
    <option value="">Select</option>
        <option value="state1">State1</option>
        <option value="state2">State2</option>
    </select>
    City: 
    <select name="city" id="city">
           
    </select>     
    <input name="submit" type="submit" value="Submit" />
</form>

JavaScript

$(document).ready(function($) {     
    $("#state").change(function() {
        var selected_state =$("#state option:selected").val(); //get the selected state
				GetAllCityByState(selected_state);
    });
        
        function GetAllCityByState(stateid) {
        $("#city").html('');
        $("#city").empty();
        if(stateid == "state1")
        {
        $("#city").append($("<option></option>").val(0).html("City1a"));
        $("#city").append($("<option></option>").val(1).html("City1b"));
        $("#city").append($("<option></option>").val(2).html("City1c"));
        }
        else if(stateid == "state2")
				{
        $("#city").append($("<option></option>").val(3).html("City2a"));
        $("#city").append($("<option></option>").val(4).html("City2b"));
        $("#city").append($("<option></option>").val(5).html("City2c"));
				}
        $("#city").select().val();
    }
});