Simple Accordion Alternative to JqueryUI

1) Load jquery and implement script

<script type="text/javascript">
  $(document).ready(function($) {
     //Click Function
      $('.accordion').find('.accordion-toggle').click(function(){
     //Expand or collapse this panel
      $(this).next().slideToggle('fast');
      //Add Active Class & Remove Not-Active Class
      $(this).toggleClass('accord-active').toggleClass("not-active");  
      //Hide the other panels
      $(".accordion-content").not($(this).next()).slideUp('fast');
      //Remove Active Class From Non-Selected And Re-Add Not-Active Class
      $(".accordion-toggle").not(this).removeClass("accord-active").addClass('not-active');   
    });
  });
</script>

2) CSS, active and not-active classes, with background image Plus/minus Icon

/***accordion***/
.accordion{background: #f3f3f3;}
.accordion-toggle {cursor: pointer;background-color: #1e2952;padding: 11px;text-align: left;color: #fff;border-bottom: 2px solid #3565b9;-webkit-transition:background-color 0.2s ease;transition: background-color 0.2s ease;}
.accordion-toggle:hover {background-color: #3565b9;border-bottom: 2px solid #1e2952;text-align: left;color: #fff;-webkit-transition:background-color 0.2s ease;transition: background-color 0.2s ease;}
.accordion-content {display: none;text-align:left;padding: 20px 40px;}
.accordion h4.accord-active{padding-left:40px;background-color: #3565b9;border-bottom: 2px solid #1e2952;-webkit-transition:background-color 0.2s ease;transition: background-color 0.2s ease;background-image: url('../images/plus-minus-sprite.png');background-repeat:no-repeat;background-position: 13px -21px;background-size: 14px;margin-bottom: 0;margin-top: 0;}
.accordion h4.not-active{margin-top:0;margin-bottom: 0px;padding-left:40px;background-image: url('../images/plus-minus-sprite.png');background-repeat:no-repeat;background-position: 13px 14px;background-size: 14px;left: 0;position: relative;}

@media(max-width:768px){
  .accordion-content p {font-size: 12px;font-weight: 500;}
  .accordion h4{font-size:12px;}
  .accordion-toggle{padding:17px;}
}

3) On the Parent Resource put in call

   <div class="accordion">
       [[getResources? 
         &parents=`[[*id]]` 
         &tpl=`SimpleJqueryAccordTpl` 
         &includeTVs=`1` 
         &includeContent=`1` 
         &showHidden=`1` 
         &sortby=`menuindex` 
          &sortdir=`ASC` 
          &limit=`99`
         ]]
   </div>

4) Make SimpleJqueryAccordTpl Chunk

<h4 class="accordion-toggle not-active">[[+pagetitle]]</h4>
  <div class="accordion-content">
      [[+content]]
  </div>

5) Now make some child question and answer resources under the Parent resource

Demo