Bubbling in JavaScript is just like a parent- child relationship, when you click a child which is nested in a parent tag, it gets the events from the upper nested tag till the end nest tag is reached.
Let me explain this simple connection with an example-
Once upon a time, there lived a prince and princess from two different countries. Prince has traveled from a very long distance to see the princess. Now, what would he does when he wants to meet a princess in the castle? As it is a castle, he cannot meet her directly.
So, he first lets know the guard that he wants to see the princess, by clicking the below tag –
Though the guard lives in the same castle, he by himself cannot meet princess in person, So, he would just let one of the maids in the castle to convey the message, by automatically clicking the below tag –
And now the maid lets the princess know that the prince has arrived to see her, by automatically clicking the below div tag and finally, prince and princess meet.
All that the prince has to do is to click on the guard tag and that automatically alerts the princess tag. This is simply explains the bubbling effect!
To see how the code works go to – https://github.com/sirishagavini/JavaScript-Bubbling
I~wiish 