JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://demo.nilooma.com/system/plugins/jquery-ui/1.10.3/css/jquery-ui-1.10.3.custom.css">
<script src="http://demo.nilooma.com/system/plugins/jquery-ui/1.10.3/js/jquery-ui-1.10.3.custom.js"></script>
<script src="http://demo.nilooma.com/system/plugins/tinymce/4.1.5/tiny_mce/jquery.tinymce.min.js"></script>
<button id="open_dialog">open dialog</button>
<div id="dialog" style="display: none;"></div>
<button id="close_dialog">open dialog</button>

JavaScript

$(document).on('focusin', function(e) {
    if ($(event.target).closest(".mce-window").length) {
		e.stopImmediatePropagation();
	}
});

function loadTiny()
{
    console.log($('textarea').html());
    $('textarea').tinymce({
        script_url : 'http://demo.nilooma.com/system/plugins/tinymce/4.1.6/tiny_mce/tinymce.gzip.php',
        toolbar: 'link',
        plugins: 'link',
        forced_root_block : '',
        init_instance_callback: function(editor) {
            console.log('tinymce init: '+editor.id);
        }
    });
}

$("#open_dialog").click(function() {
    $("#dialog").html("<textarea id='textarea' name='textarea' style='width: 90%; height: 350px;'>blablablablaaa 1234</textarea>");

$("#close_dialog").click(function() {
		$("#dialog").hide();
})

    $("#dialog").dialog({
        title: "Titleeeeeeee",
        bgiframe: true,
        height: 600,
        width: 400,
        modal: true,
        resizable: false,
        draggable: true,
        closeOnEscape: true,
        open: function() {                        
            $("body").css({ overflow: 'hidden' });
            loadTiny();
        },
        beforeClose: function() {
            tinyMCE.remove();
            $("#dialog").html(""); //we want empty the dialog content
            $("#dialog").dialog("destroy"); // and destroy the dialog, so html is clean
        }
    });
});