Question

I have a number of buttons that I’m adding/removing a class on click. My script turns all the buttons off before turning the clicked button on. The problem with this is one button is always set to on when I would like the ability to turn it off when it’s clicked a second time. I’ve tried using if statements and is(), but nothing’s worked yet. Can someone lend me a hand?

$('.silver_button').live('click', function () {
  $('.checked').text('Select').removeClass('checked');
  $(this).text("").addClass('checked');

  if ($('.challenge_card .silver_button').is('.checked')) {
    $('.silver_button').text("Select").removeClass("checked");
  }

});

Answer 1

Try this:

$('.silver_button').live('click', function () {

    if ($(this).hasClass('checked')) {

        $(this).text("Select").removeClass("checked");

    } else {

        $('.checked').text('Select').removeClass('checked');
        $(this).text("").addClass('checked');

    }

});