Here is a list of items:
<ul id='myList'>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li class='item-selected'>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
<li>Item 7</li>
</ul>
I would like to add the class item-over on mouseenter and remove it on
mouseleave for all items except those with the class item-selected.
I have attempted the following:
$('#myList li:not(".item-selected")')
.mouseenter(function(){
$(this).addClass('item-over');
})
.mouseleave(function() {
$(this).removeClass('item-over');
});
However, I have been unsuccessful.
Is there another way to achieve this?