Не отрабатывает JS

Есть вот такая HTML разметка:

<div class="rc-container-wrapper rc_container_wrapper" data-widget-container-wrapper="" data-v-app="">
    <div class="rc-container rc_container" data-widget-container="">
        <div class="rc-widget rc_widget" data-widget="">
            <div class="rc-template" data-template="">
                <div class="rc-template__legacy-radio" data-template-legacy-radio="">
                    <div class="rc-radio rc-option__onetime rc-option rc_widget__option rc_widget__option--onetime rc-legacy-radio"
                         data-option-onetime="">
                        <div class="rc_widget__option__selector" data-selector-onetime="">
                            <input id="product_7471241953525_group_432558_onetime" type="radio" name="selling_plan_432558" class="rc-radio__input rc_widget__option__input rc_widget__option__input--onetime" data-radio-onetime="" value="onetime">
                        </div>
                    </div>
                    <div class="rc-radio rc-option__subsave rc-option rc_widget__option rc_widget__option--subsave rc-legacy-radio rc_widget__option--active rc-option--active" data-option-subsave="">
                        <div class="rc_widget__option__selector" data-selector-subsave="">
                            <input id="product_7471241953525_group_432558_subsave" type="radio" name="selling_plan_432558" class="rc-radio__input rc_widget__option__input rc_widget__option__input--subsave" data-radio-subsave="" value="subsave">
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="rc_popup" data-v-21f97838="">
            <div class="rc_popup__hover" data-v-21f97838="">
                <span class="rc_popup__label" data-v-21f97838="">Subscription details</span>
                <div class="rc_popup__block" data-v-21f97838="" style="--backgroundColor:#191D48; background-color: rgb(25, 29, 72); color: rgb(255, 255, 255);"></div>
            </div>
        </div>
    </div>
</div>

Нужно что бы JS присваивал display: block; элементу с классом '.rc_popup' (ну или класс 'active', на который я в стилях пропишу display: block;) при выборе элемента с классом '.rc-option__subsave'. Уже пробовал несколько вариантов и проверять наличие доп. класса ".rc-option--active"

1 вариант:

$('.rc-option__subsave').click(function() {
    $('.rc_popup').toggle();
});

2 вариант:

$('.rc-option__subsave').click(function() {
    if ($(this).hasClass('rc-option--active')) {
        $('.rc_popup').addClass('active');
    } else  {
        $('.rc_popup').removeClass('active');
    }
});