JSFiddle - React, Tailwind, and code Playground

HTML

<input id="createPanel" type="button" value="Create a new panel" /><br />
<div id="panelsContainer"></div>

JavaScript

YUI().use('panel', 'node', function(Y) {
    var lastPanel = null;
    
    Y.on("click", function(e) {
        var justANumber = Math.round((Math.random() + 1) * 10000),
            containterDiv = Y.one('#panelsContainer'),
            newDiv = Y.Node.create('<div id="myPanel-' + justANumber + '"></div>'),
            pnlRegular;

        newDiv.appendTo(containterDiv);

        pnlRegular = new Y.Panel({
            srcNode: newDiv,
            render: true,
            visible: true,
            width: 100,
            headerContent: 'HEADER',
            footerContent: 'FOOTER',
            buttons: [{
                value: 'X',
                section: 'header',
                action: function(e) {
                    e.preventDefault();
                    pnlRegular.destroy();
                }
            }]                                                                                                                                                                    
        });

        pnlRegular.set('align', {
            node: lastPanel !== null ? lastPanel.get('srcNode') : Y.one("#createPanel"),
            points: [Y.WidgetPositionAlign.TL, Y.WidgetPositionAlign.BL]
        });
        
        lastPanel = pnlRegular;
    }, "#createPanel");

});