JSFiddle - React, Tailwind, and code Playground

HTML

<div id="hoge">click me!!</div>

JavaScript

// グローバル変数
var clicked = false;	// クリック状態を保持するフラグ
// id="hoge"の要素をシングル/ダブルクリックしたときのイベント
document.getElementById("hoge").onclick = function(evt) {
    // クリックフラグが立っている状態でのクリック
    //     -> ダブルクリック
    if (clicked) {
        alert('double click!!');
        
        clicked = false;
        return;
    }
    
    // シングルクリックを受理、300ms間だけダブルクリック判定を残す
    clicked = true;
    setTimeout(function () {
        // ダブルクリックによりclickedフラグがリセットされていない
        //     -> シングルクリックだった
        if (clicked) {
            alert('single click!');
        }
        
        clicked = false;
    }, 300);
};