What is prevObject and why is my selector returning that?

Question

I'm trying to obtain the top from an element but I'm getting this error, what does it mean and how do I get rid of it?

$(".hover").offset().top

>Uncaught TypeError: Cannot read property 'top' of undefined

$(".hover")

[div.hover, prevObject: x.fn.x.init[1], context: document, selector: ".hover", jquery: "2.0.3", constructor: function…]
[prevObject: x.fn.x.init[1], context: document, selector: ".hover", jquery: "2.0.3", constructor: function…]

This happens inside the drop event of jqueryui when I try to drop it into a nested droppable.

$.fn.makeDroppable = function(){
    $(this).droppable({
        drop: function(event, ui) {
            console.log($(".hover"));
            console.log($(".hover").offset().top);
            $(".hover").makeDroppable().removeClass("hover");
        },
        over: function(event, ui) {
            $("<div>").addClass("hover").appendTo(this);
        }
    });
}
$(".container").makeDroppable();

<div class="container"></div>

Answer 1

jQuery returns prevObject if the DOM does not have the element for which jQuery is being run. You might see the element in your source at the run-time however, it is not not bound to the DOM and therefore, it shows prevObject. Try checking your js file again or else paste the code here.

Answer 2

Although the error is not related to prevObject, I will explain it since it's a question in the title.

jQuery .end()

End the most recent filtering operation in the current chain and return the set of matched elements to its previous state.

To return its previous state, jQuery returns prevObject which contains selected elements before filtering operation, such as .find(), .filter() and .children(), is applied.

Example

$('#target').append($('div').find('input').remove().end());

$('div') will select all div elements. --- (*1)

Then, $('div').find('input').remove() will select all input elements inside the selected div elements and delete these input elements.

After that, $('div').find('input').remove().end() will return the elements before .find('input') is called. Therefore, it will return all div elements same as in (*1) except that all input elements inside divs are removed. The returned elements are stored in prevObject.

Finally, the returned elements (*1) are appended to #target.

---

.end()'s documentation: https://api.jquery.com/end/