Как правильно сделать кнопку показать-скрыть?

показать работает, но назад не скрывает

 $('.catalog__more').on('click', function(){
    let block = $(this).parents('.catalog__inner').find('.check__item[style*="display: none"]');
    block.slideToggle();
  
 })
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="catalog__inner">
<div class="check__wrap">
  <div class="check__item">1</div>
  <div class="check__item">2</div>
  <div class="check__item" style="display: none">3</div>
  <div class="check__item" style="display: none">4</div>
</div>
<button class="catalog__more">показать - скрыть</button>
</div>


Ответы (1 шт):

Автор решения: Igor

$('.catalog__more').on('click', function() {
  let block = $(this).parents('.catalog__inner').find('.check__item[style*="display: none"]');
  block.addClass('toggleclass');
  $('.toggleclass').slideToggle();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="catalog__inner">
  <div class="check__wrap">
    <div class="check__item">1</div>
    <div class="check__item">2</div>
    <div class="check__item" style="display: none">3</div>
    <div class="check__item" style="display: none">4</div>
  </div>
  <button class="catalog__more">показать - скрыть</button>
</div>

→ Ссылка