Функция click() для выпадающего меню

JavaScript jQuery

Здравствуйте! Ребят, подскажите, пожалуйста, как составить правильно функции при клике?
Пример: есть стандартная навигация на вордпрессе. Есть основной класс меню - .menu, также есть выпадающие пункты - .sub-menu.
Нужно реализовать так, чтобы при клике на определенном пункте меню, где есть подпункты, эти самые подпункты появлялись.
У меня либо появляются, но при повторном клике не исчезают, либо появляются сразу все подпункты во всем меню, либо просто не работает выпадение вообще.
Писал код по аналогии с методом hover(), но ребята сказали, что click() так работать не будет.
Вот пример того, что я писал:
HTML:
<ul class="menu">
<li>Пункт 1
<ul class="sub-menu">
<li>Подпункт 1</li>
<li>Подпункт 2</li>
</ul>
</li>
<li>Пункт 2</li>
<li>Пункт 3</li>
<li>Пункт 4
<ul class="sub-menu">
<li>Подпункт 1</li>
<li>Подпункт 2</li>
</ul>
</li>
<li>Пункт 5</li>
</ul>

JQuery:
$(".sub-menu").css({ 'opacity' : '0' });
$(".menu li").click(
function() {
$(this).children(".sub-menu").animate({"opacity":"1"},500)
},
function() {
$(this).children(".sub-menu").animate({"opacity":"0"},200)
}
);

Не работает.... Этот код взят по аналогии с функции hover() (там всё работает при наведении и отведении мышки).

Если убираю вторую функцию, то всё отлично срабатывает, но ничего естественно не исчезает при повторном клике.

Ребята подсказали, что нужно делать через if-else, мол, ЕСЛИ не существует класса, например, .open, то прояви субменю и добавь этот класс .open, ИНАЧЕ скрой субменю и удали класс .open.

Помогите, пожалуйста, составить этот запрос (если подсказали правильно) или подскажите, как нужно правильно работать с этой функцией....

Заранее благодарю! И прошу не критиковать, т.к. совсем недавно начал изучать Javascript и JQuery.
Ответы:
$(".menu li").click(function(){
       $(this).children(".sub-menu").animate({
               "opacity": +$(this).toggleClass('show').hasClass('show')
       }, 200);
});


11 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.