I can't figure out why it doesn't work I made a similar code, but it does not work, I can’t understand why, the class and the attribute are added to the button, but event show does not fire and it’s impossible to add a class to element popup_cart as if it doesn’t exist

$(document).ready(function(){
    $(document).on("click", "#user_panel", function(){
        if(typeof $(this).attr('click') === "undefined"){   
            $(this).attr('click', 'active' );
            $(this).addClass('active_e');
            $('#popup_user_panel').show();
        }else{
            $(this).removeAttr('click', 'active' );
            $(this).removeClass('active_e');
            $('#popup_user_panel').hide();
        }
    });
    $(document).mouseup(function (e) {
        var container = $('.top_right_nav');
        if (container.has(e.target).length === 0){
            $('#user_panel').removeClass('active_e');
            $('#user_panel').removeAttr('click', 'active' );
            $('#popup_user_panel').hide();
        }
    });
    
    $(document).on("click", "#panel_bag", function(){
        if(typeof $(this).attr('click') === "undefined"){   
    
            $(this).attr('click', 'active' );
            $(this).addClass('active_e');
            $('#popup_cart').show();
        }else{
            $(this).removeAttr('click', 'active' );
            $(this).removeClass('active_e');
            $('#popup_cart').hide();
        }
     });
     $(document).mouseup(function (e) {
        var container = $('.top_right_nav');
        if (container.has(e.target).length === 0){
            $('#panel_bag').removeClass('active_e'); 
            $('#panel_bag').removeAttr('click', 'active' );
            $('#popup_cart').hide();
        }
    });
});

enter image description here