I have a function that is triggered by a button click to open a new window or tab, display an alert, and update text. Here is the code snippet:
function nWin(p) {
var setStyle = "<style rel='stylesheet'>\
.vTop {\
vertical-align: top;\
}\
<\/style>";
var setScript = "<script>alert('test');<\/script>";
setScript += "<script src='http://code.jquery.com/jquery-1.11.0.min.js'><\/script>";
setScript += "<script>$(function () { $('#sText').html('UPDATED TEST'); });<\/script>";
var w = window.open();
var createBody = $(w.document.body);
var createHead = $(w.document.head);
createBody.html("");
createBody.html(p);
createBody.append("<span id='sText'>THIS IS A TEST</span>");
createHead.html(setStyle);
createHead.append(setScript);
}
However, when I click the button, the alert appears on the original page instead of the new window/tab, and the sText does not update as expected.
How do I fix this issue so that the alert shows in the new window/tab and the span text gets updated correctly?