Как при помощи jquery выполнить событие только на элементе расположенном в одном скопе с нажатым элементом?

Question

[Вячеслав Лебедев]

Есть кусочек кода:

html:
      <li>
        <a class="sub-menu-toggle" href="#">
          <i class="glyphicon glyphicon-cloud"></i>
          <span>Cloud</span>
        </a>
        <ul class="sub-menu ul-menu">
          <li>
            <a href="#">
              <i class="glyphicon glyphicon-user"></i>
              <span>Personal</span>
            </a>
          </li>
        </ul>
      </li>
      <li>
        <a class="sub-menu-toggle" href="#">
          <i class="glyphicon glyphicon-star-empty"></i>
          <span>Star empty</span>
        </a>

        <ul class="sub-menu ul-menu">
          <li>
            <a href="#">
              <i class="glyphicon glyphicon-user"></i>
              <span>Personal</span>
            </a>
          </li>
      </li>

При нажатии на элемент с классом .sub-menu-toggle, скрытый .sub-menu показывается. Кстати .sub-menu скрываю на jQ, вот так:
$('.sub-menu').slideUp(0);
В общем, такой подход мне не нравится. Но как сделать иначе, пока что не знаю :(

Код показа/скрытия .sub-menu:

$('.sub-menu-toggle').click(function () {
    $('.sub-menu').slideToggle(200);
});

И так, суть:
При нажатии на элемент с классом .sub-menu-toggle, показываются все .sub-menu. Как реализовать, что бы показывался только нужный мне .sub-menu? (расположенный в одном скопе тега li, сразу после .sub-menu-toggle, на который нажимаю)

Answer 1

[IceJOKER]

$('.sub-menu-toggle').click(function () {
    $(this).siblings('.sub-menu').slideToggle(200);
});

попробуйте )

Comments

[Вячеслав Лебедев]

Замечательно! Спасибо! :)

[IceJOKER]

slavikse: you're welcome )