Question

I’m doing some quite rudimentary jQuery stuff, getting started really, and I’m frequently navigating up the dom by doing things like

$(this).parent().parent().addClass('hello');

I was just wondering if there’s a nicer way to do this?

Answer 1

You can use parents, which returns all ancestor elements in turn. If you want to stop traversing at a particular level, use eq to filter the resulting collection. For example, to get the grandparent:

// 0 = parent, 1 = parent of parent, etc.
$(this).parents().eq(1).addClass('hello');

If you want to go upwards through the tree and stop not at a particular level, but at a particular selector match, use closest instead, e.g.:

$(this).closest("table").addClass('hello');