JSFiddle - React, Tailwind, and code Playground

by Alexey Ukolov

HTML

<div class="button-item">1</div>
<div class="button-item">2</div>
<div class="button-item">3</div>
<div class="button-item">4</div>
<div class="button-item">5</div>

JavaScript

var buttons = document.querySelectorAll('.button-item'),
    index, button;

for (index = 0; index < buttons.length; index++) {
    button = buttons[index];
    button.addEventListener('click', clickHandler);
    button.addEventListener('dblclick', doubleClickHandler);
}

function clickHandler(event) {
	console.log('click', this.innerText);
    event.preventDefault();
}

function doubleClickHandler(event) {
    console.log('doubleclick', this.innerText);
    this.removeEventListener('click', clickHandler);    
    this.removeEventListener('dblclick', doubleClickHandler);
}