Не могу понять как запустить функцию при ховере на элемент?

Question

[koshotayl]

Только начинаю изучение js, и не понимаю как сделать, чтобы весь мой код выполнялся при
ховере на элемент poster__item , а не на все сразу.
Вот код

<div class="poster__item  ">			
  <div class="content">
     <div class="wrap ">
       <div class="poster__name">
          Текст текст екст 
      </div> 
    </div>	
  </div>
</div>

$(function(){
			function truncate(str, maxlength) {
				return (str.length > maxlength) ?
				str.slice(0, maxlength - 1) + '…' : str;
			}
			let $items = $('.wrap');
			$items.each(function(i, el){
				
				let $self = $(el),
					max = 50,
					$title = $self.find('.poster__name'),
					full_title = $title.text(),
					tr_title = truncate(full_title, max);

				$title.text(tr_title);

				$('.poster__item').hover(function() {
					$title.text(full_title);
				}, function() {
					$title.text(tr_title);
				})
			});
		});

Comments

[Tim]

https://developer.mozilla.org/en-US/docs/Web/API/E...

Answer 1

[Dennis]

let poster = document.querySelector('poster__item')

poster.addEventListener('mousemove', ()=> {
код который отрабатывает при наведении
})
poster.addEventListener('mouseleave', ()=> {
код для противположного действиия "отведении" курсора
}

Answer 2

[Дмитрий Марков]

$('.poster__item').hover(function() {
//mouseenter
functionName();
}, function() {
//mouseleave
functionName2();
})