How to consolidate the multiple j query scripts I have on the page into one?

I have eight separate scripts in my page to add the slideToggle() behavior to eight different elements. Is there anyway to consolidate it into one single script so that it does not as severely impact page load times?

<div id="proficiencies_holder">
    <div id="proficiencies_menu">
        [insert_php] 
            $args = array('category_name'=>'competencies-and-domains','posts_per_page'=> -1);
            $query = new WP_Query($args);
            $i = 0;
            while($query->have_posts()):
                $i+=1;
                $query->the_post();
                $div_image = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()),'full');
                echo '<div class="prof_menu_item_holder">';
                echo '<div id="prof_button'.$i.'"class="prof_menu_item custom-parallax"style="background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)),url('.$div_image[0].')">';
                echo get_the_title();
                echo '</div>';
                echo '<div id="par_tab'.$i.'">';
                echo get_the_content();
                echo '</div>';
                echo '</div>';
                echo '<script>$(document).ready(function(){$("#prof_button'.$i.'").click(function(){$("#par_tab'.$i.'").slideToggle();});});</script>';
            endwhile;
        [/insert_php]
    </div>
</div>