Как найти n-й родительский элемент с помощью jquery

Я хочу найти n-й родительский элемент данного элемента и получить доступ к атрибутам родителя.

<div id='parent1'><br/>
  <div id='parent2'><br/>
       <span><p id='element1'>Test</p></span><br/>
  </div><br/>
  <div id='parent3'><br/>
       <span><p id='element2'>Test</p></span><br/>
  </div><br/>
</div>

Я хочу получить доступ к третьему родительскому элементу элемента1 без использования

$('#element1').parent().parent().parent()

Любая помощь будет оценена

Ответ 1

Вы можете использовать .parents() и .eq():

$('#element1').parents().eq(2);

http://jsfiddle.net/infernalbadger/4YmYt/

Ответ 2

Вы можете сделать небольшой плагин, чтобы позаботиться об этом:

$.fn.nthParent = function(n){
    var p = this;
    for(var i=0;i<n;i++)
        p = p.parent();
    return p;
}

а затем используйте его как:

$('#element1').nthParent(3);

Ответ 3

использование:

$('#element1').closest('#parent1');

Ответ 4

parent() возвращает список, поэтому это работает:

$('#element1').parents()[2];