How can two variables both be a JQuery object, yet .css property not work on one of them?
<p>In the following code, how can <code>thebody</code> and <code>app.body</code> both be a JQuery object, yet setting the <code>.css</code> property on <code>thebody</code> works but does not work on <code>app.body</code>?</p>

<pre><code>var app = app || {};

app.show = function(html) {
    this.baseElement.html(html);
};

app.body = $('body');

app.init = function() {
    this.baseElement = $('div#app');
    var thebody = $('body');
    console.log(app.objectIsJquery(thebody)); //true
    console.log(app.objectIsJquery(app.body)); //true
    app.body.css('background-color', 'yellow'); //does not set the background color, no errors
    //thebody.css('background-color', 'yellow'); //sets color correctly
};

app.start = function() {
    this.baseElement.css('color', 'brown');
    this.show(dp.qstr.addStar('testing'));
};


app.objectIsJquery = function(obj) {
    return obj.selector != undefined;
}
</code></pre>
