Меню скрывается при нажатии за его пределами. А почему не скрывается при нажатии на лейбл?

Question

[turbomen24]

Есть лейбл, который открывает меню и закрывает его (лейбл для чекбокса, когда тот отмечен - меню открывается).
Далее я применяю функцию на jquery, по которой, нажав за пределами меню и не по его дочерним элементам, чекбокс снимается - то есть меню закрывается. Это работает.
Но если я нажимаю обратно на лейбл (который не является дочерним элементом меню), ничего не происходит. Почему? То есть, тогда лейбл может только поставить галочку в чекбоксе, но снять её не может.

$(document).mouseup(function (e){
		var div = $(".menu");
		if (!div.is(e.target) && div.has(e.target).length === 0) {
		$('#menu-toogle').prop('checked', false);	
		}
});

Вот пример на codepen

https://codepen.io/turbomen24/pen/KKMZOxR

Answer 1

[vasiiil]

UPD

$(document).on('click', 'body', function (e) {
		var div = $(".menu"), 
        checkbox = $('#menu-toogle'),
        label = $('#menu-toogle + label');
		if (!div.is(e.target)
        && div.has(e.target).length === 0
        && !checkbox.is(e.target)
        && !label.is(e.target)
    ) {
      checkbox.prop('checked', false);	
		}
});

Comments

[turbomen24]

А так лейбл вовсе отказывается работать, меню не открывается при нажатии на чекбокс

[vasiiil]

turbomen24, вы правы. Ответ изменил

[turbomen24]

vasiiil, Большое спасибо, работает!