ドロップダウンメニューを動的に設定する

Question

最初のメニューを選択したときにドロップダウンメニューを作成すると、2番目のメニューに特定の項目のみが表示されるようにするにはどうすればよいでしょうか？ここに私のコードです。

<span class="title"><strong>Bag Model*</strong></span> 
<label for="dwfrm_emailsignup_customer_fname"></label> 
<select name="c_Consumers[address_state]" class="required errorclient" style="width:160px;" id="c_Consumers[address_state]"> 
<option selected="selected" value="">Select...</option> 
<option value="FlexTech">FlexTech</option> 
<option value="FlexTech-Lite">FlexTech Lite</option> 
<option value="FlexTech-Crossover">FlexTech Crossover</option> 
<option value="FlexTech-Single">FlexTech Single Strap</option> 
<option value="Supreme-Cart">Supreme Cart Bag</option> 
<option value="TM-Cart">TM Cart Lite</option> 
<option value="Custom">Custom Bag</option> 

</select> 

<span class="title2"><strong>Bag Color</strong></span> 
<label for="dwfrm_emailsignup_customer_fname"></label> 
<select name="c_Consumers[address_state]" class="required errorclient" style="width:160px;" id="c_Consumers[address_state]"> 
<option selected="selected" value="">Select...</option> 
<option value="Black">Black</option> 
<option value="Camo">Camo</option> 
<option value="Dark-Gray-Green">Dark Gray/Green</option> 
<option value="Lite-Gray-Black">Lite Gray/Black</option> 
<option value="Lite-Gray-Red">Lite Gray/Red</option> 
<option value="Lite-Gray-Yellow">Lite Gray/Yellow</option> 
<option value="Green-White">Green/White</option> 
<option value="Navy">Navy</option> 
<option value="Red">Red</option> 
<option value="Royal">Royal</option> 
<option value="White-Red">White/Red</option> 
<option value="White-Royal">White/Royal</option> 

</select> 

Answer 1

2番目のドロップダウンで選択された値を変更するための簡単なjQueryのスニペットは次のようになります。

$('#firstDropdown').change(function(){ 
    if(this.value === 'FlexTech'){ 
    $('#secondDropdown').html('<option selected="selected" value="">Select...</option>'+'<option value="Green-White">Green/White</option>'+ 
     '<option value="Navy">Navy</option><option value="Red">Red</option>'+ 
     '<option value="Royal">Royal</option><option value="White-Red">White/Red</option>'+ 
     '<option value="White-Royal">White/Royal</option>'); 
    } else { 
    $('#secondDropdown').html(''); 
    } 
}); 

は角括弧が動作しない、それに応じてIDを交換してください。 実例はここにあります： http://codepen.io/westefan/pen/BzZROj