скрипт работает лишь тогда, когда ты что-то напишешь в поле
Это как? В смысле - как вам удаётся что-либо написать в скрытый инпут?
Но окей, вам виднее...
Где инпуты находятся, что за инпуты, какой класс надо переключать:
const blockSelector = '.ingredient-b';
const inputSelector = 'input';
const className = 'display_none';
Переключаем класс у всех и сразу:
$(blockSelector)
.addClass(className)
.filter((i, n) => $(inputSelector, n).val())
.removeClass(className);
// или
document.querySelectorAll(blockSelector).forEach(n => {
n.classList.toggle(className, !n.querySelector(inputSelector).value);
});
Или, ещё и при редактировании input'ов:
$(`${blockSelector} ${inputSelector}`).on('input', ({ target: t }) => {
$(t).closest(blockSelector).toggleClass(className, !$(t).val());
}).trigger('input');
// или
document.querySelectorAll(`${blockSelector} ${inputSelector}`).forEach(function(n) {
n.addEventListener('input', this);
n.dispatchEvent(new Event('input'));
}, ({ target: t }) => t.closest(blockSelector).classList.toggle(className, !t.value));