Почему скрипт работает в консоли, но не в тильде?

Question

[Владимир Мирошник]

Добрый день.

Есть сайт: https://smart-wallet.one/draft

Пишу скрипт:

$(document).ready(function() {
    console.log('ready');

    $('input[name=people1]').on('input click change',function() {
        
        console.log('change');
        let val = $('input[name=people1]:checked').val(),
            $div = $('div[field=tn_text_1629087823180]');

        console.log(val);
    
        if(val == "до 100 гостей") $div.html('5000');
        if(val == "100–1000 гостей") $div.html('8000');
        if(val == "1000-5000+ гостей") $div.html('11000');
    
    
    
    });

});

Суть: при изменении input radio менять стоимость.

Ничего не происходит.

Но если скопирую и вставлю в консоль эту же функцию, все работает.
Вопрос, почему так?

Answer 1

[sinneren]

предположу, что эти ваши тильды сделаны на реактивном фреймворке с shadow dom, и скрипт отработал и не нашёл элементы еще до рендера их. так что надо записать что-то вроде

$(document).on('input[name=people1]', 'input click change', function() {...

ну или селектор и события местами поменять, не помню синтаксис

Comments

[Владимир Мирошник]

да, вначале события, потом селектор, заработало, спасибо большое!