$ .toggle() все экземпляры класса

Question

Привет, я пытаюсь переключить скрытые комментарии, изначально у меня было все нормально, потому что я все мои комментарии внутри одного div с классом .forum-comments.

Однако, теперь я разбивая каждый комментарий с дивами, которые имеют .forum-comments класс

Это исходный код:

// Button dynamic comment show 
    $("#forum").delegate(".btn-forum-comment-show", "click", function() { 
     $(this).parent().next(".forum-comments").toggle(); 
     var change = $(this).parent().find(".btn-forum-comment-show").text(); 
     var show = '<i class="icon-plus-sign icon-white"></i> show'; 
     var hide = '<i class="icon-minus-sign icon-white"></i> hide'; 
     if(change == ' show') 
     { 
     $(this).parent().find(".btn-forum-comment-show").html(hide); 
     } 
     if(change == ' hide') 
     { 
     $(this).parent().find(".btn-forum-comment-show").html(show); 
     } 
    }); 

функция $(this).parent().next(".forum-comments").toggle(); перестала работать, как я есть каждый комментарий с .forum-comments класса , Поэтому он только переключает первый комментарий и выключает. остальные остаются незатронутыми. Как я могу изменить это поведение, чтобы каждый комментарий был переключен?

HTML

<div class="forum-comments" > 
     <div class="forum-author">By: Jared De La Cruz on Sunday, July 07, 2013 7:31:20 PM</div> 
     <div class="forum-owner">aae15c3ff2cf790b2c7fb61dbf1a83bfadbc59762622c4b39e25ba7e5fe434fd</div> 
     <pre class="forum-body">yay comments!</pre> 
     <div class="btn-group"> 
     <a class="btn btn-mini btn-danger btn-forum-comment-del-comment" id=""><i class="icon-remove-sign icon-white"></i> delete</a> 
     </div> 
    </div> 
    <div class="forum-comments" > 
     <div class="forum-author">By: Jared De La Cruz on Tuesday, July 09, 2013 1:17:40 PM</div> 
     <div class="forum-owner">aae15c3ff2cf790b2c7fb61dbf1a83bfadbc59762622c4b39e25ba7e5fe434fd</div> 
     <pre class="forum-body">2nd comment1</pre> 
     <div class="btn-group"><a class="btn btn-mini btn-danger btn-forum-comment-del-comment" id=""><i class="icon-remove-sign icon-white"></i> delete</a></div> 
    </div> 

эти комментарии по умолчанию скрыты с style="display:none" и $.toggle() включены/отключены

здесь свалка всего раздела:

<div class="forum-post"> 
     <div><span class="forum-title">Welcome to the forum!</span><span class="forum-type label label-forum-Discussion">Discussion</span></div> 
     <div class="forum-author">By: Jared De La Cruz on Sunday, July 07, 2013 7:31:08 PM</div> 
     <div class="forum-owner">aae15c3ff2cf790b2c7fb61dbf1a83bfadbc59762622c4b39e25ba7e5fe434fd</div> 
     <pre>This is the student forum, where any student can post information with the option to add tags!</pre> 
     <div class="btn-group"><a id="" class="btn btn-mini btn-danger btn-forum-comment-del"><i class="icon-remove-sign icon-white"></i> delete</a></div> 
     <div class="btn-group"><a id="" class="btn btn-mini btn-primary btn-forum-comment"><i class="icon-comment icon-white"></i> comment</a></div> 
     <div class="btn-group"><a id="" class="btn btn-mini btn-inverse btn-forum-comment-show"><i class="icon-plus-sign icon-white"></i> show</a></div> 
     <div class="forum-comments" style="display: block;"> 
      <div class="forum-author">By: Jared De La Cruz on Sunday, July 07, 2013 7:31:20 PM</div> 
      <div class="forum-owner">aae15c3ff2cf790b2c7fb61dbf1a83bfadbc59762622c4b39e25ba7e5fe434fd</div> 
      <pre class="forum-body">yay comments!</pre> 
      <div class="btn-group"><a id="" class="btn btn-mini btn-danger btn-forum-comment-del-comment"><i class="icon-remove-sign icon-white"></i> delete</a></div> 
     </div> 
     <div class="forum-comments"> 
      <div class="forum-author">By: Jared De La Cruz on Tuesday, July 09, 2013 1:17:40 PM</div> 
      <div class="forum-owner">aae15c3ff2cf790b2c7fb61dbf1a83bfadbc59762622c4b39e25ba7e5fe434fd</div> 
      <pre class="forum-body">2nd comment1</pre> 
      <div class="btn-group"><a id="" class="btn btn-mini btn-danger btn-forum-comment-del-comment"><i class="icon-remove-sign icon-white"></i> delete</a></div> 
     </div> 
     <hr style="border-top: 1px dotted #b0b0b0;border-bottom: 0px"> 
    </div> 

UPDATE: sovled с созданием новых классов .forum-comments и .forum-comment с

var post = $(this).parents(".forum-comment");

и

$(this).parent().next(".forum-comments").toggle();

Answer 1

попытка использования nextAll вместо next

$(this).parent().nextAll(".forum-comments").toggle(); 

Проверьте document

Answer 2

Замените эту строку

$(this).parent().next(".forum-comments").toggle(); 

с

var $parent = $(this).parent(); 
$parent.next(".forum-comments").length ? $parent.next(".forum-comments").toggle() 
             : $parent.prev(".forum-comments").toggle() 

Последний комментарий раздел не будет работать, как $parent.next(".forum-comments") будет оцениваться пустым селектором. Поэтому он не будет работать в таких случаях