<!DOCTYPE html>
<html lang="en-US">
<head>
<style>
div {
padding: 50px;
text-align: center;
cursor: pointer;
background-color: rgb(0, 0, 0, 0.3);
}
</style>
</head>
<body>
<div onclick="parentFunc()">Parent
<div onclick="childFunc(event)">Child</div>
</div>
<p><strong>Note</strong>: Follow this list.</p>
<ol>
<li>Click on Parent</li>
<li>Click on Child</li>
<li>Remove 'e.stopPropagation()'</li>
<li>Click on Parent</li>
<li>Click on Child</li>
</ol>
<script>
function parentFunc(e){
alert("Parent");
}
function childFunc(e){
alert("Child");
e.stopPropagation(); // Try to remove this
}
</script> </body>
</html>