JSFiddle - React, Tailwind, and code Playground

by Leo

HTML

<div style="width: 200px; height: 200px; background-color: yellow;  top: 0; left: 0; position: absolute;" onclick="yellowclick(event)"  id="yellow"></div>

<div style="width: 200px; height: 200px; background-color: red;   top: 100px; left: 100px; position: absolute;" onclick="redclick(event)" id="red"></div>

JavaScript

window.redclick = function click1(event)
{
    alert("Current " + event.currentTarget.id + ", source " + event.target.id)
    
    var yellow= document.getElementById("yellow");
    var clone = document.createEvent("MouseEvents");
    clone.initMouseEvent('click', true, true);
    yellow.dispatchEvent(clone);
}

window.yellowclick = function click1(event)
{
    alert("Current " + event.currentTarget.id + ", source " + event.target.id)
}