Creating a popup box using jQuery or Javascript that works for all browsers
<p>I have a code like following which displays a popup message correcly in my chrome browser, but I've tested it out on other browsers such as Firefox and Edge, this doesn't works, it just crates a weird looking box on the end of the page... The code is: </p>

<pre><code>var iframe = document.createElement("IFRAME");
        iframe.setAttribute("src", 'data:text/plain,');
        document.documentElement.appendChild(iframe);
        if(window.frames[0].window.confirm("Are you sure you want to change brand state? Note: Changing brand state from Preview to Live will erase all data related to that brand.")) {
            $.post("/brand/updateBrandState", {
                'brandId': $(this).val(),
                "brandState": $(this).find("option:selected").text()
            }, function (data) {
                if (data == "ok") {
                    window.location.reload(true);
                }else if(data=="empty") {
                    alert("Cannot change state from Live to Preview");
                    window.location.reload(true);
                }else if(data=="live") {
                    alert("Brand is now live!");
                }
            });
</code></pre>

<p>Can someone help me out to make it work on other browsers as well ?? </p>

<p>Thanks !!</p>

<p>Edit: </p>

<p>now im using this html:</p>

<pre><code> &lt;div id="dialog" title="Basic dialog"&gt; 
&lt;p&gt;This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.&lt;/p&gt; 
&lt;/div&gt;
</code></pre>