Получить текст элемента на основе класса

Question

<ul class="vm_cat"> 
    <li><a class="mainlevel" href="/">MAIN LEVEL 1</a></li> 
    <li><a class="sublevel" href="/">sub 1 a</a></li> 
    <li><a class="sublevel" href="/">sub 1 b</a></li> 
    <li><a class="sublevel" href="/">sub 1 c</a></li> 
    <li><a class="sublevel" href="/">sub 1 d</a></li> 
    <li><a class="mainlevel" href="" id="active">MAIN LEVEL 2</a></li> 
    <li><a class="hide sublevel" href="/">sub 2 a</a></li> 
    <li><a class="hide sublevel" href="/">sub 2 b</a></li> 
    <li><a class="hide sublevel" href="/">sub 2 c</a></li> 
    <li><a class="mainlevel" href="/" id="active1">MAIN LEVEL 3</a></li> 
    <li><a class="hide sublevel" href="/">sub 3 a</a></li> 
</ul> 

Я хочу знать, как удалить класс hide из sublevel OnClick на #active. Я не хочу удалять hide от sublevel, который находится рядом с #active1.

Answer 1

$('.mainlevel').click(function(e){ 
    e.preventDefault(); 
    $(this).siblings('ul').toggle(); 
}) 

DEMO

Используйте класс для выбора родственный уль с помощью .siblings() и переключения по щелчку не используя .toggle()

UPDATED DEMO

Обновление демо до списка третьего уровня