Why jQuery add() method seems not to return a jQuery object?
===

Consider that you want to add an ajax functionality to many links on your page.

    <a href='http://domain/purchase/car' class='purchase'>Car</a>
    <a href='http://domain/purchase/bag' class='purchase'>Bag</a>
    <a href='http://domain/purchase/laptop' class='purchase'>Laptop</a>

and

    <a href='http://domain/sell/car' class='sell'>Car</a>
    <a href='http://domain/sell/bag' class='sell'>Bag</a>
    <a href='http://domain/sell/laptop' class='sell'>Laptop</a>

Now you might define some variables to refer to these groups of links in your JavaScript code:

    var purchaseLinks = $('.purchase'),
        sellLinks= $('.sell');

Well, enough story ;). 

You can look at the problem in [this][1] fiddle and [this][2] one.

According to [jQuery's add() documentation][3], the return value is a **new jQuery object**. And again, AMAIK inside a function handler that is attached to an event of a jQuery object, `this` referes to the DOM element.

Why by using `add()` method, `this` of the handler function refers to the `document`? I don't understand it. I can't match my knowledge to make a logical perception. In other words:

    jQueryObject1.click(function(){
        // Here, $(this) is the jQuery object
    });
    
    jQueryObject2.click(function(){
        // Here again, $(this) is the jQuery object
    });
    
    jQueryObject1.add(jQueryObject2).click(function(){
        // Here $(this) refers to the Document, why?
        // I think jQueryObject1.add(jQueryObject2) should equal jQueryObject3
    });


  [1]: http://jsfiddle.net/saeedneamati/q573N/
  [2]: http://jsfiddle.net/saeedneamati/q573N/1/
  [3]: http://api.jquery.com/add/