How to make text bolder on mouseover event in jquery?

Use the following code to make text bolder on mouseover event in jquery.

<html>
<head>
<style>
.hover
{
font-weight: bold;
color: red;
}
</style>
<!-- please include the jquery.js file here -->
<script type="text/javascript">
$(document).ready(function(){
 

  $("p").mouseover(function(){
     
    $(this).addClass('hover');
  });

 $("p").mouseout(function(){
     
    $(this).removeClass('hover');
  });

});
</script>
</head>

<body>

<p>Welcome to TechDive</p>
</body>
</html>

Search