this.offset не является функцией внутри функции щелчка

Ошибка в том что_this.offset это не функция. Я записал это на консоль, и это было<li> элемент, на который я нажал, поэтому я не понимаю, почему это не сработает.

$('.item').click(function(e) {
  var _this = this;
  var topx = _this.offset().top;
  var leftx = _this.offset().left;
  var moveArea = $('#replace').offset().top;
  var moveLeft = $('#replace').offset().left;
  var moveUp = topx - moveArea - 50;
  _this.css('position', 'absolute').css('top', moveUp).css('zIndex', 50).css('left', leftx);
  _this.animate({
    top: -50,
    left: moveLeft
  }, 300)
});
#replace {
  height: 50px;
  width: 100px;
  background-color: green;
}

#list {
  height: 200px;
  overflow-y: scroll;
}

.item {
  height: 50px;
  width: 100px;
  background-color: blue;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<div id="replace">
  Replace this
</div>

<ul id="list">
  <li class="item">TEST</li>
  <li class="item">TEST</li>
  <li class="item">TEST</li>
</ul>

Я также хочу создать анимацию так, чтобы элемент, который я нажимаю в списке, перемещался вверх, чтобы заменить зеленое поле «Заменить это», если кто-то может помочь с этим тоже.

Я создал jsfiddle, чтобы показать ошибку:https://jsfiddle.net/v5fjjwmj/2/

Ответы на вопрос(2)

Ваш ответ на вопрос