jQuery: window.opener makes a difference

Question

I'm working on localhost (so would expect to not have any domain-related probs as here).

On a page I'm using a bit of JS to modify the content of a span in the opening-window. It does not work. When checking my code to find the control, it works (using FF dev-tools calling my Increment-function or checking the console.log-output): $('#uploads_Count')returns an object of type HTMLSpanElement. However, trying to access the same control from an opened window's console with window.opener.$('#uploads_Count'), this returns an HTML-Document, seemingly the entire page. Why is this not working, what am I missing here?

Here is function that is supposed to increment the counter contained in the span whose id is given as argument:

function Increment(ctrl)
{
   var gef = $("#" + ctrl);
   if (!gef) // did not find control, maybe on opener?
   {
      gef = window.opener.$("#" + ctrl);
   }
   console.log(gef);

   cnt = parseInt(gef.text() , 10);
   cnt++;
   gef.text(cnt);
}

The HTML is trivial:

<span id="uploads_Count">0</span>

Answer 1

Found it!

The way I checked if the control was found, was wrong. Instead of if (!gef)I should have used if (!gef.length). Found the explanation here.

Answer 2

If $(selector) returns an element (such as HTMLSpanElement), rather than a collection of elements (would look like [<span id="uploads_Count"></span>] in most dev tools), then you're not calling jQuery.

Dev tools in A-grade browsers tend to introduce $ as a selector function. It is available in the developer console only.

If window.jQuery exists, then it's likely that jQuery.noConflict() was called, in which case you should use window.opener.jQuery.