Как добавить navigation к слайдеру swiper, по нажатию на блок?

Question

[Максим Призов]

<div class="sidebar__item item item__checkbox" id="navigation">
                        <h4 class="item__title">
                            Navigation
                        </h4>
                    </div>
                <div class="swiper">
                <div class="swiper-wrapper one-in-row">
                    <div class="swiper-slide">Slide 1</div>
                    <div class="swiper-slide">Slide 2</div>
                    <div class="swiper-slide">Slide 3</div>
                    <div class="swiper-slide">Slide 4</div>
                    <div class="swiper-slide">Slide 5</div>
                    <div class="swiper-slide">Slide 6</div>
                    <div class="swiper-slide">Slide 7</div>
                    <div class="swiper-slide">Slide 8</div>
                    <div class="swiper-slide">Slide 9</div>
                </div>
            </div>

$('item').click(function () {
    $('.item').removeClass('item__active');
    $(this).addClass('item__active');
})
var swiper = new Swiper(".swiper", {});
$('#navigation').click(function () {
    if($('#navigation').hasClass("item__active")) {
        $('.swiper-wrapper').after(`
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev "></div>
        `);
        swiper.params.navigation.nextEl = ".swiper-button-next";
        swiper.params.navigation.prevEl = ".swiper-button-prev";
    } else {
        $('.swiper').removeClass("swiper-pointer-events");
        $('.swiper-button-next').remove();
        $('.swiper-button-prev').remove();
        delete swiper.params.navigation.nextEl;
        delete swiper.params.navigation.prevEl;
    }
    swiper.update();
});

Answer 1

[Максим Призов]

Решение найти не смог, поэтому просто скрывал элемент и показывал его по клику.