Как сделать, чтобы при наведении на элемент скрипт применялся именно к этому элементу?

Question

[Максим Кононов]

Есть много блоков с классом "item_content", со вложенным блоком "item_icon".

<a href="#" class="item_content">
	<div class="item_icon"><i class="fa fa-search" aria-hidden="true"></i></div>
</a>

Есть скрипт, который отображает и скрывает элемент при наведении мыши.

$('.item_icon').hide()
  function InItem() {
  	$('.item_icon').fadeIn()};
  function OutItem() {
  	$('.item_icon').fadeOut()};

  $('.item_content').hover(InItem, OutItem);

Как дописать скрипт, чтобы при на ведении на каждый элемент скрипт применялся именно к этому элементу?

Answer 1

[Morfeey]

$(document).on("mouseenter", ".item_icon", function () {
   $(this).fadeIn(300);
});
$(document).on("mouseleave", "item_icon", function () {
   $(this).fadeOut(300);
});