JSFiddle - React, Tailwind, and code Playground

by dogmeethorse

HTML

<div id="d1"></div>
<br>
<div id='d2'></div>
<br>
<div id='d3'></div>
<button id="b1">button</button>

JavaScript

d1 = document.getElementById("d1");
d2 = document.getElementById("d2");
d3 = document.getElementById("d3");
b1 = document.getElementById("b1");

myEvents ={
    done : new Event('done')
}

var dude = {
    doStuff: function(){
        b1.dispatchEvent(myEvents.done);
    }
}

d1.addEventListener('done', function(){d1.innerHTML = Math.random()});
d2.addEventListener('done', function(){d2.innerHTML = Math.random()});
b1.addEventListener("click", 
                    function(){
                        b1.innerHTML = Math.random();
                        d1.dispatchEvent(myEvents.done);
                        d2.dispatchEvent(myEvents.done);
                        dude.doStuff();
                    })
b1.addEventListener('done', function(){d3.innerHTML = Math.random()});