Как адаптировать js код для множества идентичных элементов?

Stalker_RED, спасибо! На самом деле я действительно не знал, что так делать неправильно. Попробую переделать.

Есть два блока(блоков может быть больше), в каждом блоке находятся чекбокс, два селекта и элемент, который нужно скрывать/показывать в зависимости от выбранных опций селектов.
При включении одного из чекбоксов, один из селектов должен перестать скрывать/показывать нужный элемент, но только в том блоке, в котором всё это находится.

Функции, которые Вы ранее написали ( https://codepen.io/stalker-red/pen/ExdYydr ) скрывающие/показывающие необходимый элемент в зависимости от выбранных опций селектов, я немного переделал и надеялся включать их попеременно с помощью чекбокса, чтобы исключить тот самый пробел в логике, о котором Вы говорили ранее.

Как адаптировать js код для множества идентичных элементов?

Stalker_RED, прошу прощения за беспокойство. Пожалуйста, помогите! Уже третий день не могу заставить функции корректно срабатывать в зависимости от значения <input type="checkbox">. Перепробовал уже всё что мог и не знаю куда копать для решения данной проблемы.
https://codepen.io/YuriyFrolov/pen/Jjmjgdz?editors=1111

Как event.target.closest совместить с if?

szQocks, в том то и проблема, что я не имею представления о том в чем моя ошибка. Увы, но мне так и не хватило ума заставить это работать как задумано.
Но за помощь огромнейшее спасибо!

Как event.target.closest совместить с if?

Благодарю за ответ, но к сожалению это не помогло. Хотя проблема вполне может быть в другом месте.
Весь код - https://codepen.io/YuriyFrolov/pen/vYVYarq?editors=1010

Как адаптировать js код для множества идентичных элементов?

Stalker_RED, спасибо! Работает! Но в данный момент работает только при изменении опции в селектах. Может быть дадите подсказку о том как сделать так, чтобы при загрузке страницы скрипт уже учитывал атрибут selected в опциях?
Пробовал:

$('[name*="variable_backorders"]').on('change', function() {
 // Скрипт
}).trigger('change');

Но сделать это одновременно для двух селектов никак не получается.

Как адаптировать js код для множества идентичных элементов?

Stalker_RED, спасибо за потраченное на меня время, но теперь я ещё меньше понимаю как решить эту проблему, так как каждая вариация имеет свой уникальный атрибут "name" для каждого селекта и элемента. Повлиять на это я не могу.

Как адаптировать js код для множества идентичных элементов?

Stalker_RED, на текущий момент это лишь пример. На практике один из селектов будет отключен чекбоксом.

Как адаптировать js код для множества идентичных элементов?

Здравствуйте! Спасибо за ответ! Переделал. Вот что получилось - https://codepen.io/YuriyFrolov/pen/VwEZZjX
Пытаюсь сделать так, чтобы при изменении опций в селектах конкретной вариации товара, применялся стиль к элементу ".pre-orders-date-var0", который уникален для каждой вариации.

Как перенести элементы одного класса в блоки другого класса на js?

Спасибо большое! Работает!

Как поменять stock_status товара на "нет в наличии" при малых остатках?

Нашел нужный функционал в плагине "ATUM Inventory Management for WooCommerce", но ради одной опции устанавливать плагин на 38 мб не считаю целесообразным. Поковырялся в коде плагина в надежде на подсказку, но сразу понял, что до столь запутанного кода я ещё не дорос.