JSFiddle - React, Tailwind, and code Playground

HTML

Try dragging the light green box into the blue area (shows on drag start)
<div id="containment">
    <div class="row">
        <div class="draggable">
        
        </div>
    </div>
</div>

CSS

.draggable {
    height: 20px;
    width: 20px;
    background-color: lightgreen;
    float: left;
}

.filler {
    height: 300px;
    background-color: blue;
}

.row {
    display: block;
    height: 100px;
}

#containment {
    background-color: green;
}

JavaScript

$('.draggable').draggable({
    containment: '#containment',
    start: function (e, ui) {
        $('#containment').append($('<div />').addClass('row filler'));
    },
    stop: function (e, ui) {
        $('#containment').find('.filler').remove();
    }
});