如何使用javascript更改元素css类运行时

Question

i have work out with some new facility for disabling button with update panel. here i successfully disable button control and change innertext ob button with this javascript:

<script type="text/javascript">
        Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
        function BeginRequestHandler(sender, args) {
            document.getElementById('<%=btn_Login.ClientID %>').innerText = "Processing..";
            args.get_postBackElement().disabled = true;
        }
    </script> 

here i just want to make one common function for all update panel which have submit behaviour when user clicks this buttn then it detects post back and disable other all control with submit behaviour and here i just wan to change element class attribute also.

can any one help me...

Answer 1

Using jQuery

Add a class:

$('selector').addClass("classname")

Remove a class:

$('selector').removeClass("classname")

Changing whole class attribute

$('seletor').attr('class', 'classname');

---

Using Javascript

Add a class:

document.querySelector('selector').classList.add('classname')

Remove a class:

document.querySelector('selector').classList.remove('classname')

Changing whole class attribute:

document.querySelector('selector').setAttribute('class','classname');

Answer 2

You can also add or remove multiple classes $(selector).addClass('class1 class2')

OR

$(selector).removeClass('class1 class2')