After exploring various solutions to fix an issue, I've hit a roadblock. Adding CSS and jQuery code seemed promising at first, but upon refreshing the browser, a new problem emerged. The parent element retained its hover state background color, but the text reverted back to its original color instead of staying white when hovered over (#ecf0f1). Despite trying multiple strategies (about 4-5), the text refuses to cooperate.
I am at a loss for what to do next. I have attempted different methods to preserve both the parent element's hover state and text color with no success.
Unfortunately, I am unable to include the code here due to its length. Instead, please visit this link: http://jsfiddle.net/Lmdunrzj/2/. Hover over "Roster" (the second menu item from the left) and then try hovering over any drop-down items. The background maintains its hover effect, but the text does not. I am in desperate need of assistance as my efforts thus far have been ineffective.
I eagerly anticipate your responses and guidance! Thank you in advance for your help!