javascript - Jquery 如何选择 id/class 下面的元素而不是父元素？

Question

我正在尝试制作一个可以切换每个 <p> 的按钮在它下面。

这是 HTML:

<p>SHOW</p>
<p>SHOW</p>
<p>SHOW</p>

<a id="hc-more-info">MORE INFO</a>

<p>HIDE</p>
<p>HIDE</p>
<p>HIDE</p>
<ul> ... <ul>

jQuery(这是我到目前为止所得到的)我如何开始隐藏它们？

jQuery('#hc-more-info').click(function(){
        jQuery(this).parent().nextAll('p, ul').toggle();
    });

任何帮助将不胜感激! 谢谢!

Answer 1

可以使用nextAll()这将包括当前元素之后的所有兄弟元素

jQuery(function($){
    $('#toggle-below-button').click(function(){        
       var $btn = $(this), showMore = !$btn.hasClass('show-all');
       $btn.toggleClass('show-all')
            .text( showMore  ? 'LESS INFO' :'MORE INFO')
            .nextAll()
            .toggle();       
    });
});