How to stop scroll event from propagating with javascript?

Question

Lets take this simple example:

HTML:

<div id="A">
    <div id="B">
    </div>
</div>

When user moves mouse to the element B and starts to scroll, the element A should not get scroll event. How to disable scroll event from propagation?

EDIT: I've tried this js code and it does not work. Any ideas?

document.getElementById("B").scroll = function(e) {e.stopPropagation();}

Answer 1

The event.stopPropagation() method stops the bubbling of an event to parent elements, preventing any parent event handlers from being executed.

https://developer.mozilla.org/en/docs/Web/API/Event/stopPropagation