Список классов показывает ошибку. Я использую Swatch для выбора варианта Я хочу конвертировать JQuery в чистый Javascript для выбора?

Question

 <script>
  jQuery('.swatch[data-option-index="{{ option_index }}"] .{{ value | handle }}').removeClass('soldout').addClass('available').find(':radio').removeAttr('disabled');
</script>

Я изо всех сил пытался преобразовать это в чистый JavaScript. Я попробовал следующий код

  <script>
  document.querySelector('.swatch[data-option-index="{{ option_index }}"].{{ value | handle }}').classList.remove('soldout').classList.add('available').find(':radio').removeAttribute('disabled');
</script>

Но я получаю Uncaught TypeError: Невозможно прочитать свойство 'classList' из неопределенного Пожалуйста, помогите мне решить эту проблему. Я новичок в JavaScript

Answer 1

Это неправильно

.swatch[data-option-index="{{ option_index }}"].{{ value | handle }}

Попробуйте с этим

.swatch[data-option-index="{{ option_index }}"] .{{ value | handle }}