Jquery FadeIn 1元素

我正在制作一个包含3个公文包项目的主页，当我将其中一个项目悬停时，其中一个项目必须在该元素上方的div中淡出。但当我悬停在1时，我的代码在所有div中都会消失。所以我尝试了.nexist（）但现在什么也没发生。有人能帮我吗

我的html：

<div class="hpi">

    <div class="hpi_wrap">
       <h2>Title of this item</h2>
       <p>Blablablab</p>
    </div>

    <img src="//">

<div><!--End hpi1-->

<div class="hpi1">

    <div class="hpi_wrap">
       <h2>Title of this item</h2>
       <p>Blablablab</p>
    </div>

    <img src="//">

<div><!--End hpi2-->

<div class="hpi">

    <div class="hpi_wrap">
       <h2>Title of this item</h2>
       <p>Blablablab</p>
    </div>

    <img src="//">

<div><!--End hpi3-->

使用

find（）

而不是

closest（）

---

@我不高兴能帮上忙。

$(document).ready(function(e) {


    $(".hpi").hover(function(){
        $(this).closest('.hpi_wrap').fadeToggle(300);
    });

});

$(document).ready(function(e) {
    $(".hpi").hover(function(){
        $(this).find('.hpi_wrap').fadeToggle(300);
    });

});