JSFiddle - React, Tailwind, and code Playground

HTML

<b>click for red</b><br />
<b>double click for blue</b><br />
<b>triple click to remove the text</b><br/><br/>
Look at the console to see the "this".

JavaScript

$.fn.dblorone = function(single, dbl, triple){
    var DELAY = 300,
        clicks = 0,
        timer = null,
        clicked = "s",
        i = this;
    i.on("click", function (e) {
        clicks++; //count clicks
        if (clicks === 1) {
            clicked = "s";
            setTimeout(function () {
                if(clicked == "s"){
                    single(); 
                    clicks = 0; 
                }
            }, DELAY);
        } else if (clicks === 2) {
            clicked = "d";
            setTimeout(function () {
                if(clicked == "d"){
                    dbl(); 
                    clicks = 0; 
                }
            }, DELAY);
        }else{
            clicked = "t";
            triple();
            clicks = 0;
        }
    }).on("dblclick", function (e) {
        e.preventDefault(); 
    });
};

$("b").dblorone(function(){
    $(this).css("color", "red"); 
    console.log("single click"); console.log(this);
}, function(){
    $(this).css("color", "blue");
    console.log("double click"); console.log(this);
}, function(){
    $(this).remove();
    console.log("triple click"); console.log(this);
});