Jquery 用一个函数折叠每个div

有人能迅速指出我做错了什么以及原因吗？ 我的目的是让每个

.learnmore

类扩展它们自己的

。单击可获得更多内容

jQ

    $(document).ready(function(){  

      //Toggle function
      $(".learnmore").click(function(){
        $(this).next(".more-content").slideToggle(500)
        return false;
      });  
});

HTML

<div class="wrapper">
<h2>Whatsup Stack!</h2>
<img src="/image.jpg" alt="Stack Overflow" />
<p>Quick, lorem Ipsum</p>
<p><a href="#" class="learnmore">Learn More</a></p>
<div class="more-content">
  <p>Quick, lorem Ipsum</p>
  <p>Quick, lorem Ipsum</p>
</div>
<!-- eo : more-content --> 

​


干什么！
快，洛雷姆·伊普苏姆


快，洛雷姆·伊普苏姆

快，洛雷姆·伊普苏姆

​
改用

由于它不是要单击的元素的子元素，因此需要首先遍历到
.parent
。然后，因为它是下一个
。更多内容
在父级之后，您可以选择它


  //Toggle function
  $(".learnmore").click(function(){
    $(this).parent('p').next(".more-content").slideToggle(500);
    return false;
  });  

我们能看看HTML吗？这将有助于确定与这一联系有关的问题。这是一个非常简单的解决方案，在这里解决：@SirB根据标记更新了我的答案。在下一个
之前，您只需要一个
.parent（'p'）
。因为：
。更多内容可能不是
中的下一个元素。learnmore
。只有在选择器正确的情况下才能找到下一个。先生，您是个天才……您的回答帮助了我，还有一个问题。为什么不
$（这个）.each（“.more content”）.slideToggle（500）工作？因为
。每个
都需要用一个函数调用，就像
$（'.more content'）。每个（function（）{$（this）.slideToggle（500）}）
，但这将立即切换页面上的每个。
  //Toggle function
  $(".learnmore").click(function(){
    $(this).parent('p').next(".more-content").slideToggle(500);
    return false;
  });