Почему не меняется кнопка выпадающего меню при переключении?

Ankhena,

.button-subcatalog {
  position: absolute;
  top: -10px;
  left: 243px;
  z-index: 3;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: transparent;
  border: 2px solid #000000;
  opacity: 0.3;
}

.button-subcatalog-opened {
  background-image: url("../images/header/plus-icon.svg");
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: center;
}

.button-subcatalog-closed {
  background-image: url("../images/header/minus-icon.svg");
  background-size: 16px 2px;
  background-repeat: no-repeat;
  background-position: center;
}

.catalog-closed .catalog-popover-wrapper,
.catalog-closed .button-subcatalog-opened {
  display: none;
}

.catalog-open .button-subcatalog-closed {
  display: block;
}

<li class="navigation-catalog-item catalog-closed">
            <a class="navigation-link" href="catalog.html">КАТАЛОГ ТОВАРОВ</a>
            <button class="button-subcatalog button-subcatalog-open" type="button">
              <span class="visually-hidden">Подменю.</span>
            </button>
            <div class="catalog-popover-wrapper catalog-closed-nojs">
              <ul class="subcatalog-list">
                <li class="subcatalog-item">

let catalogItem = document.querySelector('.navigation-catalog-item');
let buttonSubcatalog = document.querySelector('.button-subcatalog');

catalogItem.classList.remove('catalog-closed-nojs');

buttonSubcatalog.addEventListener('click', function () {
  if (catalogItem.classList.contains('catalog-closed')) {
    catalogItem.classList.remove('catalog-closed');
    catalogItem.classList.add('catalog-opened');
  } else {
    catalogItem.classList.add('catalog-closed');
    catalogItem.classList.remove('catalog-opened');
  }
});

Почему не меняется кнопка выпадающего меню при переключении?

Ankhena, сократила код, все работает, только на кнопке знаки + и - пропали

Почему не меняется кнопка выпадающего меню при переключении?

Ankhena, спасибо за ответ и помощь)) просто на 2 курсе по верстке мы делали открытие меню с js и без него. Но там было для мобильного меню в седоне. Поэтому и спросила делается ли так вообще)) понятно теперь, что одного js хватит))

Почему не меняется кнопка выпадающего меню при переключении?

спасибо большое))) сто раз смотрела код и не заметила)) теперь все работает)

Почему при публикации проекта на git pages в браузере отображается файл readme?

Сергей Кузнецов, Хорошо)) приму к сведению)))

Почему при публикации проекта на git pages в браузере отображается файл readme?

спасибо большое за ответ) уже разобралась)

Почему при публикации проекта на git pages в браузере отображается файл readme?

WbICHA, спасибо)

Почему при публикации проекта на git pages в браузере отображается файл readme?

Ankhena, спасибо)

Почему при публикации проекта на git pages в браузере отображается файл readme?

Максим, к сожалению не работает(( пробовала