I'm encountering an issue with the mouseenter event on a div section of my webpage. I am attempting to alter the background color of this div when the mouse enters, but it seems to be disregarded.
This is the basic HTML code:
<div id="services" class="services">
<div id="services-top">
<h2>Services</h2>
</div>
<div id="services-content">
<div id="services-content-left">
<img id="services-content-right-img" class="img-circle" src="http://i.imgur.com/vN5m4vK.jpg" alt="empty">
<h3>STUFF</h3>
</div>
</div>
</div>
Here is the corresponding JavaScript code with the event:
$(document).ready(function() {
$("services-content-left").mouseenter(function() {
console.log("enter");
$(this).css("background-color", "yellow");
});
});
However, upon entering the div area, the background remains unchanged. No modifications are taking place.
You can find an example here.
Could you offer any insights on how to address this issue?