Question

I have some buttons in a container div that need to toggle active but only 1 active button at a time.

EDIT:

html is:
div container of .filter(btn, btn, btn, etc)
there are 3 containers of buttons.
The third container has a button with an id of: #filter1-none

The code below works to have only 1 button active per group.

Additionally, how would I remove active only from the button with an ID of #filter1-none ONLY if any of the other buttons are active?

$('.filter .btn').click(function () {
    $(this).addClass('active').siblings('.active').removeClass('active');
});

Answer 1

I usually do something like this:

$('.filter .btn').click(function () {
    $(this).addClass('active').siblings('.active').removeClass('active');
});

EDIT:

This doens’t allow for “toggle” behavior. So, the .btns will behave like radios, not checkboxes. Let me know if your looking for checkbox-type behavior.