W Twitter Bootstrap próbuję utworzyć listę rozwijaną przycisków z akordeonem w środku.

celem jest przedstawienie długiej listy elementów w zwięzłej formie (tzn. uniknięcie długich przewinięć przez użytkownika).

prosty sposób dołączenia div akordeonu do rozwijanego div nie działa ..:

<div class="dropdown">
    <a data-toggle="dropdown" href="#">Dropdown trigger</a>
    <div class="dropdown-menu" role="menu" aria-labelledby="dLabel" id="accordion">
    <h3>Unit 1</h3>
    <div>
      <p>item a</p>
      <p>item b</p>
    </div>
    <h3>Unit 2</h3>
    <div>
      <p>item c</p>
      <p>item d</p>
      <p>item e</p>
    </div>
  </div>            
</div>

Jakieś pomysły, jak można to wdrożyć?