Mobile website - anchor tag “stuck” in hover/active state when clicked on

[Titeleami]

I am currently building a responsive website for one of our clients and have this nasty bug when viewing the site on mobile devices such as the iPhone:The site has a main menu which is displayed as a regular horizontal menu on desktop devices and switches to a button activated dropdown menu on mobile devices. There is a second dropdown menu for the site's Search functionality which is a dropdown menu on both desktop and mobile devices.If you click the Search icon to activate the search dropdown and then click it again to close it, the hover/active state background remains.If you click afterwards onto the main navigation (in turn making another item on the page "in focus" or "active") then the hover state of the search icon returns to normal.I have tried attaching a .focusout() and/or .blur() event to the anchor tag in question but this hasn't solved the problem.It does seem to me as though the button is stuck in an active or focus state but not sure how to rectify this?Thanks