JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/EightMedia/hammer.js/master/hammer.js"></script>
<script src="https://raw.github.com/EightMedia/hammer.js/master/jquery.hammer.js"></script>
<div id=parent>
    <div id=child>
    </div>
</diV>

CSS

#parent {
    height: 100px;
    width: 100px;
    background: #aaa;
    padding: 50px;
}
#child {
    height: 100px;
    width: 100px;
    background: #222;
}

JavaScript

$('#parent').hammer().bind('tap', function(e) {
    $(this).css('background', 'red');
});

$('#child').hammer().bind('tap', function(e) {
    e.stopPropagation();
    $(this).css('background', 'blue');
});