JSFiddle - React, Tailwind, and code Playground

by Bryson Murray

HTML

<div class="elem">1</div>

<div id="first" class="clicker">click here</div>
second
<div id="second" class="clicker">1</div>

CSS

div{
  width: 100px;
  padding: 10px;
  margin: 10px;
}

.elem{
  border: 1px solid black;
}

.clicker{
  border: 1px solid blue;
}

JavaScript

$(".elem").click(function(e, callback) {
    setTimeout(function(){
      alert("Code 1");
			
      if (typeof callback === "function")
         callback();
   }, 1000);
});


$(".elem").trigger("click", function() {
    alert("Code 2");
});





$("#second").click(function(e) {
    setTimeout(function(){
      alert("Second Click Event Fired");
      $("#second").css('background', 'yellow');
			
   }, 1000);
});

$("#first").click(function() {
    alert('"Click Here" Event Fired');
		$("#second").click().then(function(){
      $("#second").css('background', 'green');
    });
});