загрузочный аккордеон 4.0 в php для WordPress Posttype

Question

Я сталкиваюсь со странным поведением аккордеона, когда я щелкаю по заголовку, целевой коллапс div вначале виден, а затем сразу скрывается и отображается. это происходит за секунду. при каждом нажатии он мигает дважды, что раздражает мой код следующий. данные из поста типа "faq"

<div id="accordion">
    <?php 
            $post_type = 'faq'; 
            $taxonomies = get_object_taxonomies( array( 'post_type' => $post_type ) );
             foreach( $taxonomies as $taxonomy ) : 
                // Gets every "category" (term) in this taxonomy to get the respective posts
                $terms = get_terms( $taxonomy );
                foreach( $terms as $term ) : $i++;?>

                <div class="card">
        <div class="card-header main-card" id="heading-<?=$i?>">
          <h5 class="mb-0">
            <a role="button" data-toggle="collapse" href="#collapse-<?=$i?>" aria-expanded="true" aria-controls="collapse-<?=$i?>">
              <?php echo $term->name?>
            </a>
          </h5>
        </div>
        <div id="collapse-<?=$i?>" class="collapse show" data-parent="#accordion" aria-labelledby="heading-<?=$i?>">
          <div class="card-body">
          <div id="accordion-<?=$i?>">
    <?php   
            $args = array(
                'post_type' => $post_type,
                'posts_per_page' => -1,
                'tax_query' => array(
                    array(
                        'taxonomy' => $taxonomy, //Default category
                        'field'    => 'slug',
                        'terms'    => $term->slug,
                        ),
                    ),
                );

        $loop = new wp_Query($args);
            while($loop->have_posts()) : $loop->the_post();
                $j++;
            ?>


              <div class="card">
                <div class="card-header sub-card" id="heading-<?=$i?>-<?=$j?>">
                  <h5 class="mb-0">
                    <a class="" role="button" data-toggle="collapse" href="#collapse-<?=$i?>-<?=$j?>" aria-expanded="false" aria-controls="collapse-<?=$i?>-<?=$j?>">
                      <?php the_title();?>
                    </a>
                  </h5>
                </div>
                <div id="collapse-<?=$i?>-<?=$j?>" class="collapse " data-parent="#accordion-<?=$i?>" aria-labelledby="heading-<?=$i?>-<?=$j?>">
                  <div class="card-body ">
                    <?php the_content();?>
                  </div>
                </div>
              </div>

          <?php endwhile; wp_reset_query();?>
          </div>
          </div>
        </div>
      </div>


        <?php endforeach; endforeach;?>


    </div>