JSFiddle - React, Tailwind, and code Playground

by Deepak Manwal

HTML

<select id="main">
    <option>all</option>
    <option class="first" value="first">first opt</option>
    <option class="second" value="second">second opt</option>
    <option class="third" value="third">third opt</option>
</select>

<select id="sub_first" class="sub">
    <option>sub 1</option>
    <option>sub 1</option>
</select>

<select id="sub_second" class="sub">
    <option>sub 2</option>
    <option>sub 2</option>
</select>

<select id="sub_third" class="sub">
    <option>sub 3</option>
    <option>sub 3</option>
</select>

JavaScript

$(".sub").hide();

$("#main").change(function() {
    var val = $(this).val();
    $(".sub").hide();

    if( val ) {
        $("#sub_" + val).show();   
    }
})