Переключить сообщения в WordPress с помощью jquery

Я пытаюсь сделать что-то, чего раньше не видел в wordpress. В основном, когда вы приходите в блог, отображается заголовок, миниатюра и выдержка. Когда нажата кнопка переключения, сообщение должно скользить вниз, чтобы показать содержимое. ( <?php the_content(); ?> )

Вот мой JQuery:

• Как удалить тег элемента из URL-адреса в форме контакта 7?
• Переменные WP Session Word не всегда устанавливаются
• Добавить новый столбец в базу данных wordpress
• Необычная ошибка «Заголовки уже отправлены». Отсутствие пробелов или изменение заголовка
• Получите подсчет недавно опубликованного продукта (сегодня) в WooCommerce

 $(document).ready(function() { $('span.play a').click(function() { if ($('.toggleSection').is(":hidden")) { $('.toggleSection').slideDown("slow"); } else { $('.toggleSection').slideUp("slow"); } return false; }); }); 

Он отлично работает! Однако; потому что переключатель помещается внутри цикла wordpress, всякий раз, когда нажимается кнопка переключения, все сообщения переключаются в открытые. Например, если у меня есть 10 сообщений на странице, и одна кнопка переключения нажата, все переключатели открываются. Вот мой цикл WP:

 <?php if(have_posts()) : while(have_posts()) : the_post(); ?> <div class="post" id="<?php the_ID(); ?>"> <div class="thumbnail"> <?php the_post_thumbnail( 'mainimg' ); ?> <span class="play"><a href="#" onclick="jQuery('#comments').toggle();"><img src="<?php echo bloginfo('template_url'); ?>/images/play.png" width="30" height="36" alt="Play Video"></a></span> </div> <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> <h3>Posted in: <span><?php the_category(', ') ?> </span>On: <span><?php the_time('l, F jS, Y') ?></span></h3> <div class="entry"> <p><?php the_excerpt(); ?> </p> </div> <!-- entry --> <div class="toggleSection"> <p><?php the_content(); ?> </p> </div> </div> <!-- .post --> <?php endwhile; ?> 

То, что вы видите выше, заключается в том, что когда нажата кнопка span.play a, переключение слайдов вниз и отображение содержимого. Когда выбран какой-либо один переключатель, появляется все содержимое. Я бы хотел, чтобы каждый переключатель был уникальным в пределах цикла WP, и только показывает содержимое этой записи. Есть идеи?

Вы можете увидеть демо-версию моей работы до сих пор: http://vitaminjdesign.com/littlewindow/ Нажмите кнопку воспроизведения над эскизами для переключения!

 $(function() { $('span.play a').click(function() { $(this).closest('.post').find('.toggleSection').slideToggle(); return false; }); });