alert() called on new window seems to be called from original page if using jQuery's methods

Question

This is the test case.

Using JavaScript:

$('.js').on('click', function () {
    var newwindow = window.open();
    newwindow.document.write('<span>test</span>');
    newwindow.document.write('<scr' + 'ipt>alert(1)</scr' + 'ipt>');
});

This gives the expected result: the dialog alert is showing inside the new window.

Using jQuery:

$('.jquery').on('click', function () {
    var newwindow = window.open();
    $(newwindow.document.body).append('<span>test</span>', '<scr' + 'ipt>alert(1)</scr' + 'ipt>');
});

The dialog alert is shown inside the main page.

Why the difference? Am I missing something here?

This behaviour has been tested in chrome/FF/safari/IE

EDIT

As pointed out by mishik, this is due to how jQuery handles script tags, using the globalEval method to run scripts in the global context. So a possible workaround for using jQuery (but not fall back to the pure JavaScript method) could be to set the newwindow variable in the global context too and use it like that, e.g:

$('.jquery').on('click', function () {
    newwindow = window.open();
    $(newwindow.document.body).append('<span>test</span>','<scr' + 'ipt>newwindow.window.alert(1)</scr' + 'ipt>');
});

DEMO

Answer 1

Seems like this is the way jQuery handles <script> tag.

domManip function in jQuery source code:

// Evaluate executable scripts on first document insertion
for ( i = 0; i < hasScripts; i++ ) {
    node = scripts[ i ];
    if ( rscriptType.test( node.type || "" ) &&
        !jQuery._data( node, "globalEval" ) && jQuery.contains( doc, node ) ) {

        if ( node.src ) {
            // Hope ajax is available...
            jQuery._evalUrl( node.src );
        } else {
            jQuery.globalEval( ( node.text || node.textContent || node.innerHTML || "" ).replace( rcleanScript, "" ) );
        }
    }
}

domManip will strip all the <script> elements, evaluate them in global context and then disable.

domManip is called by append() method:

append: function() {
    return this.domManip( arguments, function( elem ) {