Wie mache ich verschachtelte zusammenklappbare JS Akkordeon?

Question

Dies ist mein Code für ein Akkordeon. Wenn ich diesem Akkordeon verschachtelte Ebenen hinzufüge, werden die verschachtelten Ebenen nicht geöffnet, wenn ich verschiedene Ebenen innerhalb des verschachtelten Abschnitts ändere. Es schließt die ganze Sache.

<!-- JS --> 
     <script type="text/javascript"> 
     $(document).ready(function($) { 
      $('#accordion').find('.accordion-toggle').click(function(){ 

      //Expand or collapse this panel 
      $(this).next().slideToggle('fast'); 

      //Hide the other panels 
      $(".accordion-content").not($(this).next()).slideUp('fast'); 

      }); 
     }); 
     </script> 

     <!-- CSS --> 
     <style> 
     .accordion-toggle {cursor: pointer;} 
     .accordion-content {display: none;} 
     .accordion-content.default {display: block;} 
     </style> 

     <!-- HTML --> 
     <div id="accordion"> 
     <h4 class="accordion-toggle">Accordion 1</h4> 
     <div class="accordion-content default"> 
      <p>Cras malesuada ultrices augue molestie risus.</p> 
     </div> 
     <h4 class="accordion-toggle">Accordion 2</h4> 
     <div class="accordion-content"> 
      <p>Lorem ipsum dolor sit amet mauris eu turpis.</p> 
     </div> 
     <h4 class="accordion-toggle">Accordion 3</h4> 
     <div class="accordion-content"> 
      <p>Vivamus facilisisnibh scelerisque laoreet.</p> 
     </div> 
     </div> 

Answer 1

versuchen, mit diesem Code:

$(document).ready(function($) { 
    $('#accordion .accordion-toggle').click(function(){ 

    $('.accordion-content').slideUp('fast'); 
    $(this).next('.accordion-content').slideDown('fast'); 

    }); 
});