Как сделать выпадающий список при клике на блок?

Тарас чуток ты меня не понял, вывод категорий идёт через написанный шорткод

<?php
	$args = array(
        'taxonomy'   => 'product_cat',
        'hide_empty' => false,
        'parent'   => 0,
      );
      $product_categories = get_terms( $args );
      $count = count($product_categories);
    echo '<div id="new-vid-category">';
      if ( $count > 0 ){
        foreach ( $product_categories as $product_category ) {
            $thumbnail_id = get_woocommerce_term_meta( $product_category->term_id, 'thumbnail_id', true );
			echo '<article class="new-vid-catalog">';
			echo '<div class="new-vid_title">';
			echo  '<a href="' . get_term_link( $product_category ) . '" title=""><h2>' . $product_category->name . '</h2></a>';
			echo  '</div>';
			echo '<div class="new-vid__image">';
            echo  '<i><img src="'.  wp_get_attachment_url( $thumbnail_id ) .'" style="border:0;"/></i>';
            echo  '</div>';
      echo '<div class="new-vid_razdel">';
        echo '<div class="wrapper">';
          echo '<div class="content">';
            echo  '<ul class="new-parent-title__overlay">';
			$args = array(
                'taxonomy'   => 'product_cat',
                'hide_empty' => false,
                'parent'   => $product_category->term_id,
              );
              $product_categories = get_terms( $args );
              $count = count($product_categories);
              if ( $count > 0 ){
                foreach ( $product_categories as $product_category ) {
                  $thumbnail_id = get_woocommerce_term_meta( $product_category->term_id, 'thumbnail_id', true );
                 echo '<li class="new-parent-desc">';
                 echo '<div class="new-vid-razdel__image">';
                  echo '<i><img src="'.  wp_get_attachment_url( $thumbnail_id ) .'" style="width: 150px; height: 100px;"/></i>';
                  echo '</div>';
                 echo  '<a href="' . get_term_link( $product_category ) . '" title=""><h4>' . $product_category->name . '</h4></a>'; 
                 echo  '</li>';
				}}
			echo  '</ul>';
			echo  '</div>';
      echo  '</div>';
      echo  '</div>';
      echo  '</article>';
        }
      }
      
	  echo  '</div>';
?>

Вся конструкция уже есть в наличие, на данный момент, блоки, вывод категорий и разделов, тут задумался по отображению подкатегорий по клике на категорию, да можно сделать это и на js, если посидеть можно и за час додуматься, но хочу вначале попытатся осуществить через css ради мобильников

Как сделать выпадающий список при клике на блок?

по js опыта нету, сделать на css тоже реально, может кто сталкивался