JSFiddle - React, Tailwind, and code Playground

by hinablue

HTML

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <div id="workspace">
            <h3 class="live-event">Click me, by .live</h3>
            <h3 class="delegate-event">Click me, by .delegate</h3>
        </div>
    </body>
</html>

CSS

h3 { color:red; }
span { color: green; }

JavaScript

$("#workspace").click(function(e) {
    e.stopPropagation();
    $(this).append("There is #workspace click event.<br />");
}, false);

$(".live-event").live("click", function(e){
    $(this).parent().append("<span>There is .live click event.</span><br />");
}, false);

$("#workspace").delegate(".delegate-event", "click", function(e) {
    $(this).parent().append("<span>There is .delegate click event.</span><br />");
}, false);