Remove a node from the newly opened window jquery

Question

I'm trying to use the following code to open a new window.

$("#printBtn").on("click", function () {
     var w = window.open(this.href, "myWindowName", "width=800, height=600");
     $(w.document.body).children(".top-fixed-nav").remove();
     return false;
});

The problem I'm having is the new window does open with the output required but the line where I'm using $(w.document.body).children(".top-fixed-nav").remove(); isn't working ie the .top-fixed-nav doesn't remove. I've tried binding it to the ready event as well

$("#printBtn").on("click", function () {
       var w = window.open(this.href, "myWindowName", "width=800, height=600");
    $(w).ready(function(){
        $(w.document.body).children(".top-fixed-nav").remove();
    });
    return false;
});

but that didn't work either. Can anyone please tell me, what I'm doing wrong?

Update

Have tried this:

$("#printBtn").on("click", function () {
       var w = window.open(this.href, "myWindowName", "width=800, height=600");
//        $(w.document).ready(function(){
// and    $(w.document).load(function(){
        $(w.document.body).children(".top-fixed-nav").remove();
    });
    return false;
});

Both of these didn't work either.

Answer 1

$("#printBtn").on("click", function () {
    var w = window.open(this.href, "myWindowName", "width=800, height=600");
    $(w).on("load", function(){
        $(w.document.body).children(".top-fixed-nav").remove();
    });
    return false;
});

try this as onload method works on window not document.

Answer 2

Try binding to load instead of ready:

$("#printBtn").on("click", function () {
    var w = window.open(this.href, "myWindowName", "width=800, height=600");
    $(w.document).on("load", function(){
        $(w.document.body).children(".top-fixed-nav").remove();
    });
    return false;
});

After some fiddling arround got this:

$("#printBtn").on("click", function () {
    var w = window.open(this.href, "myWindowName", "width=800, height=600");
    var callInterval = setInterval(childCall, 100);
    function childCall(){
        if (typeof w.jQuery !== "undefined") {
            //w.jQuery(document.body).children(".top-fixed-nav").remove();
            w.jQuery(".top-fixed-nav").remove();
            if(typeof callInterval !== "undefined")
                window.clearInterval(callInterval);
        }

    };
    return false;
});

Give it a try and let us know if it works:D

Answer 3

You can try this:

var w = window.open(this.href, "myWindowName", "width=800, height=600");
w.document.$('body').children(".top-fixed-nav").remove();

Alternatively:

$(".top-fixed-nav", w.document.body).remove();

Note : you may have to introduce a delay to allow the window to be loaded.

setTimeout('$(".top-fixed-nav", w.document.body).remove()', 5000);