Как менять стиль при наведении на блок?

Здравствуйте, помогите пожалуйста решить вопрос.
В js можно сказать полный ноль.
Суть вопроса:
как сделать что бы при наведении на блок див, скрипт срабатывал только для данного блока? А не для всех имеющихся с данным классом.
Как можно это реализовать?
Зараннее спасибо

<div class="main-text-block-works grid">
        <div class="block-works-item">
          <img src="img/pricess1.png" alt="">
          <div class="text-block_price">
          asdasdasYYYYY
          </div>
        </div>
        <div class="block-works-item">
          <img src="img/pricess1.png" alt="">
          <div class="text-block_price">
          asdasdasYYYYY
          </div>
        </div>
        <div class="block-works-item">
          <img src="img/pricess1.png" alt="">
          <div class="text-block_price">
          asdasdasYYYYY
          </div>
        </div>
        <div class="block-works-item" id="item_4">
          <img src="img/pricess1.png" alt="">
          <div>

          </div>
        </div>
        <div class="block-works-item" id="item_5">
          <img src="img/pricess1.png" alt="">
        </div>
      </div>

.text-block_price{
  position: absolute;
  bottom:0;
  padding: 25px;
  height: 50%;
  width: 100%;
  background: white;
  z-index: 10;
  display: block;
  transition: 0.3s;
  transform: translateY(100%);
  &_hover{
    transform: translateY(0%);
  }
}

$(document).ready(function(){
  $('div').each(function(){
    $('.block-works-item').on('mouseover', function() {
      $('.text-block_price').addClass('text-block_price_hover');
    });
    $('.block-works-item').on('mouseout', function() {
      $('.text-block_price').removeClass('text-block_price_hover');
    });
  });
});

изображение 1(не наведено)

изображение 1(наведено)