---
title: "Discussion on \"Bubbling in JavaScript?\" | Hashnode"
description: "Discussion on \"Bubbling in JavaScript?\". What is bubbling ?\nlets suppose there  is three boxes One, two ,three. Two is children of one and three is children of two and grandchildren of three like below pen.\nhttps://codepen.io/Dr_rackham/full/wVJzWB\nHTML\n\n<div class=\"one\">\n  <div class=\"two\"..."
url: "https://hashnode.com/posts/bubbling-in-javascript/5d3faf35ea67aca069f055cf"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [Bubbling in JavaScript?](https://rackham.hashnode.dev/bubbling-in-javascript?utm_source=hashnode&utm_medium=feed)

What is bubbling ? lets suppose there is three boxes One, two ,three. Two is children of one and three is children of two and grandchildren of three like below pen. https://codepen.io/Dr\_rackham/full/wVJzWB HTML <div class="one"> <div class="two"...

Jul 30, 2019 · rackham.hashnode.dev  
Read the article

-   [#javascript](https://hashnode.com/tag/javascript)
-   [#html5](https://hashnode.com/tag/html5)

## Written by

[Krish Singh](https://hashnode.com/@rackham)

@rackham · Bengaluru

  
[View profile](https://hashnode.com/@rackham)

I am not the best but no one is better than me

## Responses 1

Markdown supported · ⌘↵ to post

[Purvi Barot](https://hashnode.com/@purvi)

[Apr 23, 2020](https://hashnode.com/posts/bubbling-in-javascript/5d3faf35ea67aca069f055cf/comment/5ea14afe12892a3c760b4212)

When an event happens on an element, it first runs the handlers on it, then on its parent, then all the way up on other ancestors.

Let’s say we have 3 nested elements : form , div, p .

```
<form onclick="alert('form')">form
  <div onclick="alert('div')">div
    <p onclick="alert('p')">p</p>
  </div>
</form>
```

```
<style>
  body * {
    margin: 10px;
    border: 1px solid blue;
  }
</style>
```

If we click on p tag,then see 3 alerts - p ,div,from. The process is called “bubbling”.