次のようなHTMLがあります。
<div class="td">
<i class="fa fa-hoge"></i>
<div class="piyo">
<span class="name">田中田中</span>
<div class="radio">
<div class="r-radio">
<input id="radio-1" name="hogehoge" type="radio" value="true" />
<label for="radio-1">true</label>
</div>
<div class="r-radio">
<input id="radio-2" name="hogehoge" type="radio" value="false" />
<label for="radio-2">false</label>
</div>
</div>
</div>
</div>
こちらにおいて現在、radioボタンを押した後に発火したイベントを取得し、
this の中身は
<input id="radio-1" name="hogehoge" type="radio" value="true" />
のnodeになっております。
このthisの状況から、 <i class="fa fa-hoge"></i>
を取得したいのですが、
this.closest("i")
としても取得できませんでした。
this.find("i")
でもダメでした。
this.parentElementを繰り返せば、取得はできるのですが、可読性に問題があるため、できれば避けたいです。
新しいセレクタを作成してというのも考えられるのですが、
この td があと20個ほどありますため、現在のノードから、近いところの i
を取得したいと考えております。
どのようにすれば実装できるのかわからず、困っております。
よろしくお願いします。