【jQuery】親要素のさらに上の要素を選択したい

jquery

とある案件にて、ある要素の親要素のさらに親要素を選択したい時に普通に「parent()」メソッドを仕様すりぁいいじゃんと思いきやそううまくいかず。
かと言って直接「$(“div#親要素名”)」と指定できない場合で微妙だったりした場合。

parents()メソッドを仕様する

parentメソッドの場合は複数の親要素があっても1つの親要素しか返さないのに対して、parentsメソッドは親要素のさらに親要素・・・とルート要素以外すべて返してくるようです。

parentcheck.html

上記のhtmlを元にjqueryで試す

上記の場合だと、どちらのメソッドでもひとつ上の親である「thirdWrap」が選択できます。
今回は一番上の親要素・・つまり一番外側のdiv要素「firstWrap」を取得したいのでその場合の挙動を「parent」と「parents」で行ってみた。

動作確認

「parents()」の場合は親要素のfirstの一部を指定(全部指定できたらそもそも普通に指定するので・・)してみる。「parent()」の場合は上記のようにparent().parent().parent()と3つ上の階層まで指定しているのでめんどいです。ただ階層が分かっているなら名前はなんでもいいし、逆に「parents()」は、あまり階層を意識しなくて済みそうだなーという印象。使い方間違ってるのかな。