JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<button type="button" id="foo">click me</button>

JavaScript

$.event.special.superClick = {
    add: function( handler, data, namespaces ) {
        // called for each bound handler
      console.log("A");
    },

    setup: function( data, namespaces ) {
        // called once per an element
      console.log("B");
      jQuery( this ).bind( "click", jQuery.event.special.superClick.handler );
    },

    remove: function( namespaces ) {
        // called for each bound handler
      console.log("C");
    },

    teardown: function( namespaces ) {
        // called once per an element
      console.log("D");
      jQuery( this ).unbind( "click", jQuery.event.special.superClick.handler );
    },

    handler: function( event ) {
      console.log("HANDLER");
        // set correct event type
        event.type = "superClick";
        // trigger multiclick handlers
        jQuery.event.handle.apply( this, arguments );
    }
};


$("#foo").on("superClick", function(e){
  console.log(e);
  alert("superClicked!");
});