为什么我没有在被删除的元素下面获取元素？

Question

我的笔：http://codepen.io/helloworld/pen/XJMMxV

如何在被删除的元素下面获取元素？目前我得到的元素我没用，因为我已经通过ui.draggable [0]得到了它。

我不想为所有元素引入z-index。这会导致更多问题。

只知道我使用div的绝对位置。

<div id="itemContainer"> 
  <div class="item i1">1</div>
  <div class="item i2">2</div>
  <div class="item i3">3</div> 
</div>

<!-- border-box => IE9+ -->
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

body, html { 
  padding:0;
  margin:0;
  height:100%; 
}

.item{
  position:absolute; 
}

#itemContainer{
  background:orange;
  height:100%; 
  position:relative; 

}

.item.i1 {
   width: 50%; 
   height:50%;
   background:lightgreen;

}

.item.i2 {
   width: 50%; 
   height:50%;
   top:50%;
   background:lightgray;;
}

.item.i3 {
   width: 50%; 
   height:100%;  
   left: 50%;
   background:blue;   
}
.align-vertical-colums {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

$(document).ready(function () {
    $("#itemContainer > div").each(function (index, element) {
        $(element).draggable();  
        $(element).addClass("align-vertical-colums");
    });

  $("#itemContainer").droppable({       
        activeClass: "ui-state-hover",
        hoverClass: "ui-state-active",
        drop: function (event, ui) {

          var element = document.elementFromPoint(event.clientX, event.clientY);        

        }
    });
});