Javascript 将下一个和上一个ACF字段设置为当前

我有一个光滑滑块的ACF环。我正在尝试将上一张和下一张幻灯片的标题添加到当前幻灯片中

<?php if (have_rows('videofeed','option')): ?>
<div class="slider-popular">
            <?php while (have_rows('videofeed2','option')) : the_row(); ?>
                <div class="slider-go-wrap slick-current">
                      <h2 class="video-title"> <?php the_sub_field('video_title'); ?> </h2><!-- the video title -->

                    <div class="video-controls">
                                <div class="prev-title-popular">
                                    <span class="controltitles prev-videotitle">PREVIOUS TITLE HERE <?php the_sub_field('video_title'); ?></span> <!-- previous  ACF row sub_field "video_title" here -->
                                </div>

                                <div class="next-title-popular">
                                    <span class="controltitles next-videotitle">NEXT TITLE HERE <?php the_sub_field('video_title'); ?></span><!-- next ACF row sub_field "video_title" here -->
                                </div>
                    </div>
                </div>
            <?php endwhile;?>
</div>     
<?php endif; ?>

JSFiddle：

---

如有任何建议，将不胜感激

你想要下一篇和上一篇文章吗？这是一个滑块，所以我需要下一篇和上一篇文章中的ACF字段“video_title”。问题是它只适用于一个div，但应该适用于所有幻灯片：

$('.slider-go-wrap').each(function() {
  currentSlide = $('.slick-current');
   nextSlide = currentSlide.next();
   prevSlide = currentSlide.prev();

   nextSlideData = nextSlide.find('.next-videotitle').html();
   prevSlideData = prevSlide.find('.prev-videotitle').html();
});