現在のノードから近い要素を取得しようとした際に、this.closest("i") としても取得できず困っております。

次のような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 を取得したいと考えております。

どのようにすれば実装できるのかわからず、困っております。
よろしくお願いします。