Пример, поясняющий проблему:
https://jsfiddle.net/63auormL/
Нужно, чтобы работали отдельно события для #mother и для #daughter. Если не пытаться отвязать событие click для #mother (смотритре на 7 строку), то при клике на #daughter будет выполняться click по нему + уходя вверх к #mother. Как додумать код, чтобы всё работало правильно.
Внимание! Сразу останавливаю самую логичную мысль - отцепить #daughter от #mother, чтобы они были отдельными блоками. Дело в том, что данная проблема возникает в плагине всплывающего окна. Там есть оверлей, который накладывает на страницу слой (тень), а уже внутри слоя-тени модальное окно. Так вот, клики по модальному окну вызывают автоматом и клики по оверлею. Не пойму, как правильно отвязать при этом клик по материнскому оверлею. И да, там использую
$(document).on("click","#modal",function(){}); для обработки события клика, ибо HTML код уже модифицируется после готовности DOM, как я понял, в этом случае, нужно обращаться к событиям именно так. Поэтому имеется что-то типа:
HTML:
<div id="#overlay">
<div id="#modal"></div>
</div>
JS:
$(document).on("click","#modal",function(){
//события для клика по модальному окну
});
$(document).on("click","#overlay",function(){
//события для клика по оверлею
});