Handle hover event
Description
The following code shows how to handle hover event.
Example
<html>
<head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(<!-- w w w . j ava2 s . c o m-->
function() {
$("div span:first-child").css("text-decoration", "underline")
.hover(function() {
$(this).addClass("red");
}, function() {
$(this).removeClass("red");
});
});
</script>
<style>
span {
color: #008;
}
span.red {
color: red;
font-weight: bolder;
}
</style>
</head>
<body>
<div>
<span>A,</span> <span>B,</span> <span>C</span>
</div>
<div>
<span>D,</span> <span>E,</span> <span>F</span>
</div>
</body>
</html>