自身のかなり上方の祖先である親は、そのまた親要素で何番目なのか？
親の親は何番目？という簡単そうで難しかった・・・

くだらない事で2日も費やしたのでメモ・・・


こんな環境のHTMLである

<div "~~何処か~~">
 <div class="oya_no_oya">
  <div class="uenohouno_oya">
   <div>....（div が何階層もあるイメージ）
        <div class="targetChilled">対象の子供<div>
   </div>.... (何階層もあるのを終了する）
  </div>
 </div>
</div>

上記の様な構図で、子供である.targetChilled がクリックされたときなどに、
その子供が含まれる.uenohouno_oya 要素はoya_no_oya 要素で何番目なのか？
という事が知りたい！！！

○まずミスケース、removeからテストしていたので
$('.export-rule-delete-button').click(function (){
 $(this).parents('.uenohouno_oya').remove();
 alert($('#export-rule-item-area').children('.uenohouno_oya').index($(this).parents('.uenohouno_oya')));
}

this ポインタを使いたい場合には、this はremove などが
入っているとthis の内容まで変化して使えなくなっていることに気がつかなかった・・・(2日も)


○動く様にすると
$('.export-rule-delete-button').click(function (){
 alert($('#export-rule-item-area').children('.uenohouno_oya').index($(this).parents('.uenohouno_oya')));
 $(this).parents('.uenohouno_oya').remove();
}

やはりremove は後でなければいけない、もしくは$(this)を
thisObj =$(this)で変数にでも入れて、保存して、それを用いれば
this の値が変わっても使える

○あまり意味があるかどうか分からないが
$('.export-rule-delete-button').click(function (){
 alert($('#export-rule-item-area').children('.uenohouno_oya').index($(this).parents('.uenohouno_oya').get(0)));
 $(this).parents('.uenohouno_oya').remove();
}

.get(0) を追加しておいてみた、理由は
$(this).xxx() で取得した内容は、add()などを含み、ほぼ多くの場合で
中身がdocument 要素から取得したDOMではないので、
オブジェクトの比較に使えない場合もあるかもしれない場合も
もしかしてあるかもしれない？と思ったから、でも必要無いかも。
○動く様にすると
の部分で完成でいいかもしれない。

参考(結果的にあまり使わなかったが良かった参考リンクメモ)
jQueryオブジェクトの比較
jqueryオブジェクトを比較する時はDOMエレメントを比較しよう
JavaScript - jQueryオブジェクトの比較 - Qiita
jQueryオブジェクトの比較 - paranitips

追伸：
これ、また続きを作りました・・・済みませんorz
遠い祖先（親の親ｘn）から見た その子の要素は何番目かを知る(jQuery)