2番目のリストに表示されている/表示されていないリストのための順序付けられていないリストボタン

Question

最初のリストと3番目の順序付けられていないリストのためのショーless/moreボタン（10個以上のアイテム） 2番目のUL（追加された場合は4番目）では、ボタンは何もしません。私は理由を理解できないようだ。

HTML：

<ul class="tijdlijn-list"> 
<li class="item1"></li> 
<li class="item2"></li> 
<li class="item3"></li> 
<li class="item4"></li> 
<li class="item5"></li> 
<li class="item6"></li> 
<li class="item7"></li> 
<li class="item8"></li> 
<li class="item9"></li> 
<li class="item10"></li> 
<li class="item11"></li> 
<li class="item12"></li> 
<li class="item13"></li> 
<li class="item14"></li> 
<li class="item15"></li> 
</ul> 

<ul class="tijdlijn-list"> 
<li class="item1"></li> 
<li class="item2"></li> 
<li class="item3"></li> 
<li class="item4"></li> 
<li class="item5"></li> 
<li class="item6"></li> 
<li class="item7"></li> 
<li class="item8"></li> 
<li class="item9"></li> 
<li class="item10"></li> 
<li class="item11"></li> 
<li class="item12"></li> 
<li class="item13"></li> 
<li class="item14"></li> 
<li class="item15"></li> 
</ul> 

<ul class="tijdlijn-list"> 
<li class="item1"></li> 
<li class="item2"></li> 
<li class="item3"></li> 
<li class="item4"></li> 
<li class="item5"></li> 
<li class="item6"></li> 
<li class="item7"></li> 
<li class="item8"></li> 
<li class="item9"></li> 
<li class="item10"></li> 
<li class="item11"></li> 
<li class="item12"></li> 
<li class="item13"></li> 
<li class="item14"></li> 
<li class="item15"></li> 
</ul> 

jQueryのスクリプト：

$('.tijdlijn-list').each(function(){ 
var max = 10; 
if ($(this).find('li').length > max) { 
    $(this).find('li:gt('+max+')').hide().end().append('<li class="sub_accordian"><div class="show_more">Toon alles</div></li>'); 
    $('.sub_accordian').click(function(){ 
     $(this).siblings(':gt('+max+')').toggle(); 
     if ($('.show_more').length) { 
      $(this).html('<div class="show_less">Toon minder</div>'); 
     } else { 
      $(this).html('<div class="show_more">Toon alles</div>'); 
     }; 
    }); 
}; 
}); 

Answer 1

私はあなたの問題はあなたが正しくトリガいない$(this)onclick内部イベントを持っているということだと思います。あなたはここにそう$(this).find('.sub_accordian').click(function(){代わりの('.sub_accordian').click(

$(this).find('.sub_accordian').click(function(){ 

を使用して試すことができます例です。ここで https://jsfiddle.net/wa12rvgg/2/