JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<body>
    
<div id="destination" class="notify-attachment"></div>

<input type="button" value="create iframe" onclick="createIFrame()" /> 
<input type="button" value="delete iframe" onclick="deleteIFrame()" />

</body>
<script type="text/javascript">

function createIFrame() {
    
    if(typeof console != 'undefined') {
        console.log("creating frame");  
    }
    
    $('.notify-attachment').append('<iframe name="photo-upload-frame-${ut}" height="0" width="0"></iframe>\
                                    <div class="attach-link-input stream-photo-upload">\
                                        <form class="photo-upload" method="post" target="photo-upload-frame-${ut}" action="" enctype="multipart/form-data">\
                                            <label class="file-label">Click the &ldquo;&nbsp;+&nbsp;&rdquo; to add a photo</label>\
                                            <input name="source-photo" type="file" />\
                                        </form>\
                                    </div>');

        photoHiddenIFrame = $('.notify-attachment').find("iframe").hide();
        photoHiddenIFrame
            .bind('load', function(e) {
                j = $(this).contents().find('textarea').val();
                if (j) {
                    j = j.replace(/(\&gt\;)/gi, ">"),
                    j = j.replace(/(\&lt\;)/gi, "<"),
                    jj = eval('(' + $.trim(j) + ')');
                    ta.trigger('upload_complete', [jj]);
                }
            });


        /* ie hackery */
        if ($.browser.msie){
            photoHiddenIFrame.data("loadFix", setInterval(function() {
                if ($.trim(photoHiddenIFrame.contents().html())) {
                    if (photoHiddenIFrame.data("loadFix")) clearInterval(photoHiddenIFrame.data("loadFix"));
                    photoHiddenIFrame.trigger('load');
                }
            }, 500));
        }
}

function deleteIFrame() {
   ...

JavaScript

function createIFrame() {
    
    if(typeof console != 'undefined') {
        console.log("creating frame");   
    }
    
    $('.notify-attachment').append('<iframe name="photo-upload-frame-${ut}" height="0" width="0"></iframe>\
                                    <div class="attach-link-input stream-photo-upload">\
                                        <form class="photo-upload" method="post" target="photo-upload-frame-${ut}" action="" enctype="multipart/form-data">\
                                            <label class="file-label">Click the &ldquo;&nbsp;+&nbsp;&rdquo; to add a photo</label>\
                                            <input name="source-photo" type="file" />\
                                        </form>\
                                    </div>');

        photoHiddenIFrame = $('.notify-attachment').find("iframe").hide();
        photoHiddenIFrame
            .bind('load', function(e) {
                j = $(this).contents().find('textarea').val();
                if (j) {
                    j = j.replace(/(\&gt\;)/gi, ">"),
                    j = j.replace(/(\&lt\;)/gi, "<"),
                    jj = eval('(' + $.trim(j) + ')');
                    ta.trigger('upload_complete', [jj]);
                }
            });


        /* ie hackery */
        if ($.browser.msie){
            photoHiddenIFrame.data("loadFix", setInterval(function() {
                if ($.trim(photoHiddenIFrame.contents().html())) {
                    if (photoHiddenIFrame.data("loadFix")) clearInterval(photoHiddenIFrame.data("loadFix"));
                    photoHiddenIFrame.trigger('load');
                }
            }, 500));
        }
}

function deleteIFrame() {
    $('.notify-attachment').empty();
}