When an event occurs,
like the click of a button
element, the event added
to the button element gets
triggered.
Additionally, the events
added to the parent element
of the button and the
parent element of the parent
element
and
so on are all
triggered too.
This process is called as
event propagation.
Let us have a look at an example:
In the code above,
when we click on the button,
we can see that both Button clicked!
and
Div clicked!
are shown in the console.
This means that the event on the button
and
the event on the div
were both triggered.