JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css">
<a id='openDialog' href="#">open dialog</a>
<div id='results'></div>
<div id='mypop'>
    <form id='myform' method='post' action=''></form>
</div>

JavaScript

var counter=0;
function AddCheckbox() {
    counter++;
    $('#myform').append("<input type='checkbox' name='chk"+counter+"' id='chk"+counter+"' /><label for='chk"+counter+"'>Listing "+counter+"</label><br/>");
}

$(function() {
    $('#mypop').dialog({
        modal: true,
        autoOpen: false,
        buttons: [
            {
                text: 'Add',
                click: function() {
                    AddCheckbox();
                }
            },
            {
                text: 'Save',
                click: function() {
                    $('#results').html('');
                    $('input:checkbox:checked').each(function(i, em) {
                        $('#results').append("<a href='#' onclick='$(this).remove()'><div style='border:1px solid green;background:green;width:auto;float:left;overflow:none;word-wrap: break-word;margin-right:4px;' id='res_"+$(this).attr('id')+"'>" + $("label[for='" + $(this).attr('id') + "']").text() + '</div></a>');
                    });
                    $(this).dialog('close');
                }
            },
            {
                text: 'Cancel',
                click: function() {
                    $(this).dialog('close');
                }
            }
        ]
            
    });
    $('#btnAdd').click(function() {
        AddCheckbox();
    });
    $('#btnSave').click(function() {
        AddCheckbox();
    });
    $('#openDialog').click(function() {
        $('#mypop').dialog('open');
    });
});