How do I prevent a click handler being triggered when a child element is clicked?

Question

I have two div tags, first div is the father and the second div is son Inside the father like this

Answer 1

You can pass the event as one of the arguments in the closeFather function, then check whether the event target is the father element. See this example

function closeFather(e) {
    if(e.target == document.getElementById('father')) {
        //do stuff
    }
};

Then in the HTML you just need to add the event argument to the javascript function.