Как обратиться к предку более простым способом?

Question

[tltary]

Есть вот такая структура

<div class="main-block">
 <div class="block">
  <img src="url">
  <div class="wrap">
   <div class="item js-item-wrap" data-main="1">
    <img src="url">
   </div>
  </div>
 </div>
  <div class="block-2">
  <span class="item js-item" data-item="1"></span>
 </div>
</div>

нужно при наведении на js-item-wrap обратиться к js-item с таким же значением атрибута

$('.js-item-wrap').mouseleave(function(){
        $(this).parent().parent().parent().find('.js-item[data-item='+$(this).data('main')+']').css('opacity','0.45');
})

вопрос как сократить вот это вот ? $(this).parent().parent().parent()

Answer 1

[Dymok]

.closest()

Comments

[Антон Спирин]

Только для IE11 полифилл нужен.

[Алексей Уколов]

Антон Спирин, jquery же, не ванильный.

[Антон Спирин]

Алексей Уколов, ой, чет я не обратил внимание что речь о JQuery. Для JQuery не нужен.

Answer 2

[Владимир]

$(this).parents(".main-block")