How to change the color of a button, glyphicon and text when clicking on it?

Question

It works fine when I switch the button and it changes glyphicons. But I also want to change the text and color. Here is my code

HTML

<button class="btn btn-primary">
   <i class="glyphicon glyphicon-plus">
        &nbsp;Add
</button>

Javascript

 $(document).ready(function() {
     $(':button').click(function(){
     $(this).find('i').toggleClass('glyphicon-plus').toggleClass('glyphicon-ok');
});

try, it doesn’t help me - removeClass('btn-primary').addClass('btn-danger').text('chosen')

Answer 1

$(document).ready(function() {
     $(':button').click(function(){
    $(this).find('i').toggleClass('glyphicon-plus glyphicon-ok').toggleClass('btn-primary btn-danger' );
    });

The toggleClass function can take 2 parameters. If 2 parameters have passed, it will switch one and one depending on which class is currently applied to the element.