如何从下拉列表中选择选项值以选择另一个下拉列表的ID？

Question

我有一个很长的选择下拉菜单。单击每个选项时，应显示另一个下拉列表。这是一个示例HTML代码。因此，当我选择section1时，selction将出现section1 id，当我点击section2时，将显示section2 dropdwon。

<select id="section_id" name="section">
<option>--Select -</option>
<option value="section1">section1</option>
<option value="section2">section2</option>
</select>

<select id="section1" name="sub_section">
<option>--Select -</option>
<option value="section1">subsection</option>
<option>subsection</option>
</select>
<select id="section2" name="sub_section1">
<option>--Select -</option>
<option value="section1">section</option>
<option>section</option>
</select>


My js code:

$(document).ready(function(){
            $("#section_id").change(function(){
            var v = $(this).val();
            var y = document.getElementById(var);
             if (if (v==y)){
                $("#" + y).show();
             }
             else{
                $("#" + y).hide();
             }
            });
        }); 

Answer 1

$(document).ready(function(){
            $("#section_id").change(function(){
             var v = $(this).val();
             var y = $('#'+v);
             y.show();
             y.siblings('[sub_*]').hide()
            });
        });