<div class="menu-container">
         <div class="left">
       <?php if (have_rows('menu_items')):
         while (have_rows('menu_items')): the_row(); ?>
         <a href="#/"><div id="<?php the_sub_field('menu_id'); ?>" class="menu-item"><?php the_sub_field('menu_item'); ?></div></a>

       <?php endwhile;
     endif; ?>
   </div>
     <div class="food-container">
       <?php if (have_rows('food_items')):
         while (have_rows('food_items')): the_row(); ?>
       <div id ="<?php the_sub_field('food_id'); ?>">
         <div class="food-item-container">
      <div class="food"> <h3><?php the_sub_field('food_name'); ?></h3>
       <?php the_sub_field('food_description'); ?>
     </div><div class="price"><?php the_sub_field('price'); ?></div>
   </div>
       <div class="clear"></div>
       <?php endwhile;
     endif; ?>
       </div>

<script>
$(document).ready(
    function() {
        $("#menu-item1").click(function() {
            $("#food_id1_1, #food_id1_2, #food_id1_3, #food_id1_4, #food_id1_5, #food_id1_6").fadeToggle();

        });
        $("#menu-item2").click(function() {
            $("#food_id2_1, #food_id2_2, #food_id2_3, #food_id2_4, #food_id2_5, #food_id2_6").fadeToggle();

        });
    });
    </script>