JSFiddle - React, Tailwind, and code Playground

HTML

<div class="inputholder">
    <input type="text" id="inputtext"/>
</div>

CSS

.tag
{
    margin-right:2px;
    background:green;
    color:white;
    text-align:center;
    padding:5px;
}
span {
     background:green;
}
input
{
    border:0;
    display:inline-block;
    padding:5px;
}

input:focus
{
    outline-width:0;
}

.inputholder
{
    border:1px solid black;
    padding:5px;
}

JavaScript

$(function(){    
    $("#inputtext").keypress(function(e){
        var valueofinput= $(this).val();
        if(e.which==13)
        {
            $('#inputtext').before('<span class="tag">' + valueofinput + '</span>');
            $('input').val('');
        }
    });
    $(document).on('click', '.tag', function(){
        $(this).remove();
    });
    $('.inputholder').click(function() { $('#inputtext').focus(); });
});