JSFiddle - React, Tailwind, and code Playground

by George Batt

HTML

<div class="wrp">
    
</div>
<div class="childd">
</div>

CSS

.wrp{background-color:#aaf;border:1px solid orange;float:left;width:100%}
.wrp .child{float:left;height:20px;width:20px;background-color:#77c;border:1px solid #cdcdcd;}
.childd{height:20px; width:20px; background-color:#cdcdcd;}

JavaScript

$('.childd').on('click',function(){
    for(i=0;i<=9;i++){
        $('.childd')
            .clone()
            .removeClass('childd')
            .addClass('child')
            .html(function(){
                return i==4 ? 'b' : 'a'   
            })
            .appendTo('.wrp');
    }    
})