<div id="div">
  <p id="p">
    <button id="button">Click me</button>
  </p>
</div>
div.addEventListener("click", () => {
  alert("The <div> element is clicked.");
});

p.addEventListener("click", (event) => {
  alert("The <p> element is clicked.");
  event.stopPropagation();
});

button.addEventListener("click", () => {
  alert("The <button> element is clicked.");
});
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.