JSFiddle - React, Tailwind, and code Playground

by anurag

HTML

<html>
    <body>
        <div id="create">
            Click to create div
        </div>
    </body>
</html>

CSS

#create {
     width:150px;
     height:25px;
     margin-bottom:5px;
     background:#ccc;
     border:1px solid #222;   
}

.new {
    width:200px;
    height:100px;
    background:#ffccff;
    border:1px solid #333;   
}

JavaScript

document.getElementById('create').onclick = function(){
    var newdiv = document.createElement('div');
    newdiv.addClass('new');
    document.body.appendChild(newdiv);
};

document.getElementsByClassName('newdiv').onclick = function(){
    alert('Success');
};
    
document.onclick = function(event) {
    var el = event.target;
    if (el.className == "new" && el.nodeName == "DIV") {
        alert("div.new clicked");
    }
};