Event Bubbling and Stop Propagation

What is event bubbling?

Event bubbling or event propagation is an important concept in JavaScript and jQuery. To understand this concept, let’s examine the example below.

The following HTML page has three nested elements. A span element is nested within a paragraph element, and the paragraph element is further nested within a div element. This nesting can be visualized in the page output. In the JavaScript for this web page, we use jQuery to set up click event handlers for all three elements. Each event handler, once triggered, displays an alert box with the text specifying the clicked element (div, p, or span).