autocomplete, обработка элемента списка при фокусе
 

Добрый день.
Делаю список autocomplete с картинками:

.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
        return $( "<li>" )
                .data( "ui-autocomplete-item", item )
                .append( "<div class=\"autocomplidiv\"><a>"+"<img class=\"autocompliimg\" src= \""+item.icon+"\"/>" +"&nbsp<br/>" +item.label + "</a></div>" )
                .appendTo( ul );

При этом пытаюсь при фокусе элемента списка добавить ему класс:

focus: function( event, ui ) {
            $(ui.item).addClass("ui-state-focus");
        }

но класс не добавляется.
Подскажите пожалуйста, что я неправильно делаю?

culver, у фокуса
ui.item это обьект данных строки на которую навели но не сама строка

можно поискать по содержанию

focus: function( event, ui ) {

            $('li:contains("'+ui.item.label+'")').addClass("ui-state-focus");


        }

Спасибо, работает.
Но получается, что прямого доступа из функции, к элементу, получившему фокус нет? Странно, что-то не верится.

culver,
выведите в консоль да посмотрите ui кроме label и value никакой больше информации

Вопрос почти риторический, но всё же.
Пока я не делал обработку фокуса, класс ui-state-focus добавлялся к li автоматически, подозреваю, что есть обработчик фокуса по умолчанию, где и добавляется этот класс, интересно как?

culver,
return $( "<li>" )

return $( "<li>" , {class : 'ui-state-focus'})

и не мучать фокус

Если класс добавлять в _renderItem то все элементы списка его получат, а мне нужно только тот, что в фокусе.
Сейчас это выглядит у меня так:

$('.ui-menu-item').removeClass("ui-state-focus")
            $('li:contains("'+ui.item.label+'")').addClass("ui-state-focus");

а дальше с помощью стилей подсвечиваю элемент с фокусом.

.ui-autocomplete  .ui-state-focus div{
	font-weight:bold;
    background-color: #eeeeee;
}

Или Вы хотите сказать, что рендер отрабатывается каждый раз при фокусе, а не только при начальном формировании списка?

culver,
может вам hover нужен

.ui-autocomplete li div:hover{
font-weight:bold;
background-color: #eeeeee;
}

и никаких add и remove

но hover не будет реагировать на перебор списка с помощью клавиатуры.