使用next div中的文本为"next“按钮设置文本

Question

我正在尝试将下一个按钮的html设置为下一个div中<h2>的内容？

<div id="survey-1" class='content'>
    <h2>Bob</h2>
    <a href="#" class='next button'></a>                      
</div>

<div id="survey-2" class='content'>
    <h2>Fred</h2>
    <a href="#" class='next button'></a>                      
</div>

<div id="survey-3" class='content'>
    <h2>Joey</h2>
    <a href="#" class='next button'></a>                      
</div>

到目前为止我只有，

for (var i = 1; i <= 3; i++) {
        $('.next').html('Next Student '+$("#survey-"+i).children().html());
};

但我希望他们都不同..。有什么想法吗？

Answer 1

尝试以下几点：

$('.next').each(function(){
  $(this).text($(this).parent().next().find('h2').text());
});

演示Fiddle