JSFiddle - React, Tailwind, and code Playground

by Abhishek Ghosh

HTML

Product Name:
<input id="prodName" type="text">
<br>
<button class="btnAdd" value="Click Me!">Add Product</button>
<br/>
<br/>
<br/>
<div id="content" height="100px" width="100px" style="color:blue"></div>

JavaScript

$('.btnAdd').on('click', function () {
    $('<div/>', {
        id: 'newCo',
        title: $("#prodName").val(),
        text: $("#prodName").val()
    }).css({
        fontWeight: 700,
        width : '30px',
        background : 'lightblue',
        padding: '2px',
        margin: '5px',
        float : 'left'
    }).appendTo("#content");
});

$('#newCo').on('click',function(){
    $(this).remove();
});