jquery slideToggle () для нескольких классов

Question

У меня есть список:

 ...
 <li>
      <a href="#" class="slide"></>Click me</a>
      <div class="newsitem">
           ...some content here
      </div>
 </li>
 <li>
      <a href="#" class="slide"></>Click me</a>
      <div class="newsitem">
           ...some content here
      </div>
 </li>
 ...

Я хочу использовать slideToggle следующим образом:

$(".slide").click(function() {
     $(".newsitem").slideToggle("fast");
     return false;
});

Дело в том, что я хочу, чтобы различные slide классы просто slideToggle следующий newsitem класс. Я пытался использовать .closest(), .nextSibling() и т. Д.

Небольшая помощь в решении этой простой (вероятно) проблемы?

Answer 1

Заменить:

$(".newsitem").slideToggle("fast");

На:

$(this).next(".newsitem").slideToggle('fast');

Здесь документация для метода next ():

Получите ближайшего родственника каждого элемента в наборе соответствующих элементов.Если указан селектор, он извлекает следующего брата, только если он соответствует этому селектору.

Вот рабочий пример: http://jsfiddle.net/andrewwhitaker/3DqNF/

Также , выбыл неверный HTML.Вот исправленный HTML:

<ul>
    <li>
        <a href="#" class="slide">Click me</a>
        <div class="newsitem"></div>
    </li>
    <li>
        <a href="#" class="slide">Click me</a>
        <div class="newsitem"></div>
    </li>
</ul>

Answer 2

хм, может быть, это работает:

$(".slide").each(function(){
  $(this).click(function() {
    $("this > .newsitem").slideToggle("fast");
    return false;
  });
});