Javascript 切换按钮类和文本

我正在尝试用jquery更改文本和图标。当你点击按钮时，它会改变，但当你再次点击按钮时，它会挣扎。图标和文本不会更改回默认值

代码隐藏

 string box = "<div class=\"alter-Wrp\"> <div class=\"alert alert-danger {0}\">{1}</div></div>";

        if(count > 0)
            litAlert.Text += String.Format(box);

---

很确定这就是你想要做的：

$('.btn-dangerr').click(function (e) {
    $('.alter-Wrp').slideToggle();
    $('.beee').toggleClass('glyphicon-bell glyphicon-fire');
    if ($('.beee').hasClass('glyphicon-fire')) {
        $('.text').text('Hide Alarm');
    } else {
        $('.text').text('Show Alarm');
    }
});

---

乍一看，这看起来比需要的复杂得多。请用文字说明应该发生什么。你不能随意链接到本地文件。请点击TidyUp按钮并按照建议进行操作。我希望它现在能起作用？

$('.btn-dangerr').click( function(e) {
        var tgl = $('.btn-dangerr');
        var box2 = $('.alter-Wrp');
        var icon = $('.glyphicon');
        var text = $('.text');
        var toggleClass = '.beee';
        icon.addClass('glyphicon-bell');
        text.text('Show Alarm');
        box2.slideToggle(function (){
            if (tgl.hasClass(toggleClass)) {
                icon.removeClass('glyphicon-bell').addClass('glyphicon-fire');
                text.text('Hide Alarm');

            } else  {
                e.preventDefault();
            }
            $('.btn-dangerr').toggleClass(toggleClass);
        });
});

$('.btn-dangerr').click(function (e) {
    $('.alter-Wrp').slideToggle();
    $('.beee').toggleClass('glyphicon-bell glyphicon-fire');
    if ($('.beee').hasClass('glyphicon-fire')) {
        $('.text').text('Hide Alarm');
    } else {
        $('.text').text('Show Alarm');
    }
});