Eu tenho um menu CSS que define a cor do pai do pai quando passa o mouse sobre ele e é o filho ul (submenu). Basicamente, quando você passa o mouse sobre o menu, ele muda de cor e permanece assim até o mouse sair do menu e do submenu. Parece legal.

Eu adicionei algum código jQuery para alterar a cor dos itens de menu quando até que uma determinada página seja aberta. Então, esses menus vão desaparecer e recuperar a cor. Em que ponto, esperando por um foco mudar de cor.

O problema que estou tendo é, quando você muda a cor de volta para seu estado original (definido em CSS) com jQuery, ele remove a classe: hover impedindo a mudança de cor ao passar o mouse sobre ela e seu submenu filho. Alguma ideia de como consertar isso? Existe um seletor com jQuery que me permita configurar a classe: hover de volta ao normal?

/* ---- Menu Colours ---- */
$(document).ready(function()
{
   var colours = ['d50091', 'c8fa00', '00b4ff', 'b158fc', 'ffa800', '00b72f'];
   var counter = 0; // Loop for the colurs
   var status  = 0; // Status of the colours (greyed out or visible)

   $('ul.menu-horiz').children('li').children('a').hover(function()
   {
      $(this).parent()[0].css('color', '#d50091');
   }, function()
   {
      $(this).parent()[0].css('color', '#b6b6b6');
   });

   $('ul.menu-horiz').children('li').children('a').each(function()
   {
      $(this).css({opacity: 0.2, color: '#' + colours[counter]});
      counter++;
   });

   $('.haccordion .header').click(function()
   {
      if (window.location.hash.substr(1) == 'photogallery')
      {
         $('ul.menu-horiz').children('li').children('a').each(function()
         {
            if ($(this).css('opacity') != '1.1')
            {
               $(this).animate({opacity: 1.1}, 1000).css('color', '#b6b6b6');
            }
         });
      }
      else
      {
         counter = 0;
         if ($('ul.menu-horiz').children('li').children('a').css('opacity') != '0.2')
         {
            $('ul.menu-horiz').children('li').children('a').animate({opacity: 0.2}, 1000, function()
            {
               $('ul.menu-horiz').children('li').children('a').each(function()
               {
                  $(this).css('color', '#' + colours[counter]);
                  counter++;
               });
            });
         }
      }
   });
});