Double clicks

HTML

<div class="container">
    <div class="header"> <a href="#" class="this">BUTTON</a>
        <h2>Double click it</h2>

    </div>
</div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/2.2.26/rx.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/2.2.26/rx.async.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/2.2.26/rx.coincidence.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/2.2.26/rx.binding.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs/2.2.26/rx.time.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/rxjs-dom/2.0.7/rx.dom.js"></script>

CSS

body {
    font-family: sans-serif;
    padding: 10px;
}
h2 {
    font-weight: bold;
    display: inline-block;
    margin-left: 20px;
}
.header {
    background: #ECECEC;
    padding: 5px;
}

JavaScript

function afterSilence(duration, obs) {
    return obs.buffer(function() { return obs.throttle(duration); });
}

var btnElm = document.querySelector('.this');
var msgElm = document.querySelector('h2');

var clickStream = Rx.Observable.fromEvent(btnElm, 'click');
var groupedClicks = afterSilence(250, clickStream);
var nrStream = groupedClicks.pluck('length');

nrStream.subscribe(function setMessageText(nr) {
    msgElm.textContent = (nr === 1) ? 'click' : nr + ' clicks';
});

afterSilence(1000, nrStream).subscribe(function clearMessageText() {
    msgElm.textContent = '';
});