Notice the difference between .target
and .currentTarget
This property of event objects is the object the event was dispatched on. It is different than event.currentTarget when the event handler is called in bubbling or capturing phase of the event.
event.target
// A reference to the target to which the event was originally dispatched.event.currentTarget
// A reference to the currently registered target for the event.
Worth testing:
$("body").on('mouseup', '#parent1', function (e) {
console.log(e.target,e.currentTarget);
});
Demo jQuery
Demo plain javascript
More reading:
MDN: event.target
MDN: event
jQuery (an explanation about Direct and delegated events)