JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/pepper-grinder/jquery-ui.css">
<div id="workspace">
    <button id="CloneBool">Clone the Boolean</button><br>
    <button id="CloneText">Clone the Text Field</button><br>
    <button id="CloneBlank">Clone the Blank Input</button><br>
    <div class="container ui-widget-content" id="SourceDivs">
        <div style="font-size:20px"><u>What should be Copied</u></div>
        <div class="ui-state-default cFormBlock">
            <div class="cFormCancelDiv">
                <button class="cancel_option" />
            </div>
            <div class="cFormLabelDiv">Boolean Option</div>
            <div class="cFormDataDiv">
                <div class="radio_wrapper">
                    <input type="radio" id="true1" name="bools1" /><label for="true1">True</label>
                    <input type="radio" id="false1" name="bools1" /><label for="false1">False</label>
                </div>
            </div>
        </div>
        
        
        
        <div class="ui-state-default cFormBlock">
            <div class="cFormCancelDiv">
                <button class="cancel_option" />
            </div>
            <div class="cFormLabelDiv">Text Field</div>
            <div class="cFormDataDiv">
                <input class='text ui-widget-content ui-corner-all white_input' type='text'/>
            </div>
        </div>
        
        
        
        <div class="ui-state-default cFormBlock">
            <div class="cFormCancelDiv">
                <button class="cancel_option" />
            </div>
            <div class="cFormLabelDiv">Blank</div>
            <div class="cFormDataDiv"></div>
        </div>
    </div>
    
    <div class="container ui-widget-content" id="PasteSpace">
        <div style="font-size:20px"><u>Where it should be copied to</u></div>
    </div>
</div>

CSS

#workspace {
    padding: 5px;
    min-width: 500px;
    max-width: 500px;
}

.ui-buttonset{
    width: 100%;
}

.container{
    padding: 5px 5px 2px;
    margin-bottom: 10px;
}

.cFormBlock{
    border-style: solid;
    border-width: 1px;
    width: 100%;
    display: table;
    height: 38px;
    padding: 3px;
    margin-bottom: 5px;
}
.cFormBlock .cFormCancelDiv {
    padding: 3px;
    position: relative;
    display: table-cell;
    min-width: 18px;
    vertical-align: middle;
}

.cFormBlock .cFormCancelDiv .cancel_option {
    width: 18px;
    height: 100%;
    margin-right: 0px; 
    border: 0px;
}

.cFormBlock .cFormLabelDiv {
    padding: 3px;
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    min-width: 190px;
    max-width: 190px;
    word-wrap: break-word;
}

.cFormBlock .cFormDataDiv{
    padding: 3px;
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

.cFormBlock input{
    width: 100%;
    height: 100%;
    font-size: 1.2em;
}

.white_input {
    background: #F8F8F8;
}

JavaScript

function fnMakeCancelButtons() {
    $("#workspace").off("click", ".cancel_option");
    $(".cancel_option").button("destroy");
    
    $(".cancel_option").button({
        icons: { primary: "ui-icon-close" },
        text: false
    });
    $("#workspace").on("click", ".cancel_option", function(){
        $(this).parent().parent().remove();
    });
}


//Initializing the fields and final css tweaking
$("#SourceDivs").find(".cancel_option").hide();
$("#SourceDivs").data("counters",{
    "NumOfBools": 1,
    "NumOfTexts": 1,
    "NumOfBlanks": 1
});
$(".radio_wrapper").buttonset().children().css("width","49.5%");
fnMakeCancelButtons();


//Javascript for on button clicks
$("#CloneBool").on("click",function(event){
    alert("What should this button do?");
    fnMakeCancelButtons();
});
$("#CloneText").on("click",function(event){
    var sAppendString = "",
        nCounter = $("#SourceDivs").data("counters").NumOfTexts;
    
    sAppendString =
        '<div class="ui-state-default cFormBlock">' +
            '<div class="cFormCancelDiv">' +
                '<button class="cancel_option" />' +
            '</div>' +
            '<div class="cFormLabelDiv">Text Copy #' + nCounter + '</div>' +
            '<div class="cFormDataDiv">' +
                '<input class="text ui-widget-content ui-corner-all white_input" type="text"/>' +
            '</div>' +
        '</div>';
    
    $(sAppendString).appendTo("#PasteSpace");
    $("#SourceDivs").data("counters").NumOfTexts+= 1;
    sAppendString = null;
    nCounter = null;
    fnMakeCancelButtons();
});
$("#CloneBlank").on("click",function(event){
    var sAppendString = "",
        nCounter = $("#SourceDivs").data("counters").NumOfBlanks;
    
    sAppendString =
        '<div class="ui-state-default cFormBlock">' +
            '<div class="cFormCancelDiv">' +
                '<button class="cancel_option" />' +
            '</div>' +
            '<div class="cFormLabelDiv">Blank Copy #' + nCounter + '</div>' +
    ...