Using Accordion from jQuery UI, I get unwanted blue highlighting around the last clicked link

Question

I am using the Accordion widget from the jQuery user interface.

Whenever I click a title to expand a section, that title (in fact, the link inside the h3 element) is highlighted. In Chrome, it has a blue highlight, as if it were the selected field in the form.

I need to get rid of the blue backlight, so I cracked the code below, and it seems to be working so far.

However, I am wondering if there is a better / cleaner way to do this in jQuery. Is it correct?

$(function() { $( "#mainnav" ).accordion().blur($('#mainnav')); }); 

Answer 1

I don't need jQuery to fix the problem ( .blur() doesn't seem to work).

jQuery added class = "ui-state-focus" to html, so I used CSS to indicate that this class should not be highlighted / highlighted, for example ...

 #mainnav .ui-state-focus { outline: none; } 

Answer 2

For me, this works for jQuery UI 1.9.2, Tabs widget:

 #mainnav .ui-tabs-anchor { outline: none; }