jQuery如何在沒有父級的情況下選擇ID /類下的元素？

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();       
    });
});

Answer 2

您可以使用$（'p'）作為選擇器

編輯

請原諒我在評論之前不了解。 您也可以使用.next方法，但在我看來，更好的做法是將一些類分配給下面的元素，然后像$（'p.toggle'）一樣進行切換來控制它。

Answer 3

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