JSFiddle - React, Tailwind, and code Playground

HTML

<button>Add item</button>
<div class="event">
    I will say when when you have clicked!<br />    
<div>

CSS

.container{
    width:300px;
    border:1px solid;
    margin:200px;
    min-height:100px;
}

.item{
    display:block;
    height:30px;
    background:black;
    border:1px solid #fff;
}

JavaScript

jQuery.fn.test = function(options){
    
    return this.each(function(){
        $container = $("<div class='container'></div>").appendTo("body");
        
        $("button").click(function(){
            var $item = $("<div class='item'></div>").click(function() {
               alert("Foo"); 
            });
            $container.append($item);
        });
        
        
        //shouldn't this select every div inside $container?
        $("div", $container).live("click", function(){
           $(".event").append("clicked! <br />"); 
        });
        
    });
    
}
    
$("body").test();