You are using $(item).hide()
, which sets the style prop. And that overrides every other selector. Meaning you can’t select them and give a higher specificity style.
Instead, remove all $(item).hide()
calls, and set a class on the items so that you can hide them on mouseOut
, and show them on mouseEnter
.
.hideItems {
display: none;
}
/* then, use the relevant one... */
$('.online, .all').removeClass('hideItems')
$('.online, .all').addClass('hideItems')