Кнопка с Jquery не работает повторно, как заставить ее работать?

Question

[MajorTom69]

Делаю выпадающее меню на сайте, после первого нажатия менюшка выпадает, после второго скрывается, вроде все норм, но повторно кнопка никак не реагирует, что не так???
JQ:

$(".menu-button").click(function(){
        $(".top-links").addClass("show");
        
        $(this).click(function(){
            $(".top-links").removeClass("show");
        });
    });

CSS:

@media only screen and (max-width : 768px) {
    .top-links {
        display: none;
        width: 12rem;
        margin: 5.5rem 0 0 5.5rem;
        background-color: #303030;
        position: absolute;
        vertical-align: middle;
        z-index: 1;
    }
    .top-links a {
        display: block;
        margin: 5px;
        border-bottom: 1px solid;
    }
    .show {
        display: block;
    }
}

HTML:

<button class="menu-button hidden-sm hidden-md hidden-lg col-xs-1"><i class="fa fa-bars" aria-hidden="true"></i></button>
<div class="top-links">
    <a href="#">Услуги</a>
    <a href="#">Цены</a>
    <a href="#">Портфолио</a>
    <a href="#">Контакты</a>
</div>

Answer 1

[Andrey Perov]

$(".menu-button").click(function(){
        $(".top-links").toggleClass("show");
});

toggleClass переключатель лучше использовать

Comments

[MajorTom69]

сделал, отличная штука, но все же на будущее интересно узнать, где у меня была ошибка

[Andrey Perov]

MajorTom69 во второй раз два клика срабатывает он добавляет и сразу удаляет класс `show`

[Andrey Perov]

так криво писать

[MajorTom69]

Andrey Perov: аа, спасибо, я только учу js и jq в частности, а это решение на Stack Owerflow подсмотрел

[Andrey Perov]

MajorTom69 сначала натив хорошо выучить надо