Wordpress post slideToggle with each() issue

Question

I feel like I've been trying everything to get this to work, the problem is that I'm not that familiar with javascript nor jQuery. My guess is that it's as simple as just adding one line, because I've almost got it to work.

I have a Wordpress blog which loops out numerous of posts, I've added unique ID's to everyone of them, which I'm able to grab the problem is that it doesn't work with slideToggle to show the content.

<script type="text/javascript">//<![CDATA[ 
    $(window).load(function(){
        $(document).ready(function() {

            $(".toggleContainer").hide();

            $('.show_hide').click(function() {
                event.preventDefault();
                var pid = $(this).data('id');
                var cid = $(this).data('container');

                $(pid).add(cid).each(function() {
                    $(cid).slideToggle(1000);
                });

            });

        });
    });//]]>
</script>

Then there's the container:

<div class="toggleContainer" data-container="<?php the_id(); ?>">
    <?php do_action( 'woocommerce_before_single_product_summary' ); ?>
</div>

And the toggle:

<a href="<?php the_permalink(); ?>" class="show_hide" data-id="<?php the_id(); ?>">

If I use an alert on each of them it shows the correct ID, but it doesn't work when I want to toggle the content.

Answer 1

试试： $('[data-container*='+cid+']').slideToggle(1000);