There seems to be a problem when setting focus to an element using jquery. It apparently does not trigger the :focus css property set on an element.
For example in my css I have:
div.item1:focus { border:2px solid red; }
in my jquery I have:
$("div.item1").focus();
The focus is set but there is no red border applied to the element.
Go to jQuery focus() page to see :
The focus event is sent to an element when it gains focus. This event is implicitly applicable to a limited set of elements, such as form elements (
<input>,<select>, etc.) and links (<a href>). In recent browser versions, the event can be extended to include all element types by explicitly setting the element's tabindex property. An element can gain focus via keyboard commands, such as the Tab key, or by mouse clicks on the element.
Go to PPK's study of focus on browsers here
PPK focus Event Browser compatibility
It looks like all browsers pass the tabindex test.
You need to do this:
$("div.item1").focus(function(){
$("div.item1").css("border","2px solid red");
});