HTML

js add class when hover

<script>
  $(document).ready(function () {
    $(".box").hover(
      function () {
        $(this).addClass("box-hover");
      },
      function () {
        $(this).removeClass("box-hover");
      }
    );
  });
</script>

add class on hover css

/* example: your html code is like this: 
<h2 class="firstname">Firstname </h2>
<p class="secondname">Secondname </p>
/*

h2.firstname:hover {
  background-color: yellow;
}

p.secondname:hover {
  background-color: blue;
}