jQuery: selecting grandparents

Solution 1:

You can use the parents() method which matches parents against a selector

http://api.jquery.com/parents/

Or if you're using 1.4 there is a new parentsUntil() method

http://api.jquery.com/parentsUntil/

Solution 2:

In addition to parents(), as they've said, you should also check out closest(). Read the comparison in the documentation there, but its main differences are that it searches for only one result, and it includes $(this) in what it searches (could get the thing you're searching from if you're not specific enough). Pros and cons.

Solution 3:

I wrote this simple plugin because I thought I had an unambiguous class selection somewhere giving me errors. Selecting grandparent seemed more direct than $().parents() for this particular case.

Well, I used this once then realized I actually had a spelling error. Not sure how helpful it really is. $('myelem').gparent(2); gets you the grandparent of 'myelem'.

(function( $ ){
$.fn.gparent = function( recursion ){
    if( recursion == undefined ) recursion = 2;
    if(typeof(recursion) == "number"){
        recursion = parseInt( recursion );
        if( recursion > 0 ){
            gparent_holder = $(this);
            for(var gparent_i = 0; gparent_i < recursion; gparent_i++){
                gparent_holder = gparent_holder.parent();
            }
            return gparent_holder;
        }
        else return false;
    }
    else return false;
}
})( jQuery );