javascript - Twitter Bootstrap ドロップダウン トグルを使用して、別のドロップダウン トグルまたは div をトリガーする

Question

いくつかのオプションでドロップダウン トグルを作成する必要があります。ユーザーがドロップダウンからこれらのオプションのいずれかを選択すると、別のドロップダウン トグルがトリガーされてすぐ下に表示されるか、Div を呼び出してコンテンツが表示されます。

私はBSのドキュメントを見てきましたが、実際にはトリガーや、別のdivまたはドロップダウンを呼び出して表示するために必要なものには触れていません。

これは私が持っているもののjsfiddleへのリンクです。

ユーザーが前のドロップダウン トグルから「オプション 1」を選択した場合にのみ、2 番目のドロップダウンが表示されるようにします。

<div class="question">
<div class="btn-group">
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
    Select one                    <b class="caret"></b>
  </a>
  <ul class="dropdown-menu">
    <li><a href="#" id="opt1" >Option 1</a></li>
    <li><a href="#" id="opt2">Option 2</a></li>
    <li><a href="#" id="opt3">Option 3</a></li>
    <li><a href="#" id="opt3">Option 4</a></li>
  </ul>
</div>

<div class="question">
  <div class="btn-group">
      <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        Another One                    <b class="caret"></b>
      </a>
      <ul class="dropdown-menu">
        <li><a href="#" id="opt5" >Option 5</a></li>
        <li><a href="#" id="opt6">Option 6</a></li>
        <li><a href="#" id="opt7">Option 7</a></li>
        <li><a href="#" id="opt8">Option 8</a></li>
      </ul>
    </div>
</div>

私が得ることができる助けを本当に感謝します。