Как сделать, чтобы при нажатии в любое место переключался класс?

Question

[Денис Кузьмин]

Как сделать, чтобы при нажатии в любое место страницы (кроме элементов списка) убирался класс .opened у элемента .form-group? Чтобы список сворачивался при нажатии вне элемента .form-group (а так же при нажатии на ".form-group .control-label").

Пример на codepen:

Answer 1

[Сергей delphinpro]

Сегодня юбилейный, 50-й раз, когда я даю ссылку на решение этой проблемы =)
https://yandex.ru/search/?text=javascript+click+ou...

Answer 2

[Денис Кузьмин]

Так сделал:

$(document).mouseup(function (e){
    var configboxfg = $(".config-box .form-group.opened");
    if (configboxfg.has(e.target).length === 0){
        configboxfg.toggleClass('opened');
    }
});

Comments

[Александр]

$(window).click(function (event) {
  if ($(event.target).closest('.form-group').length === 0) {
    $('.form-group.opened').removeClass('opened');
  }
});

А ещё можно без jQuery обойтись.