jquery autocomplete focused item increases font size

648 Views Asked by At

working on jquery autocomplete
trying to enlarge font size of focused item to distinguish itself using:
css: li.focused { font-size:16px; }

in jquery autocomplete delegate focus event to handler:
focus: autocompleteItemFocusedHandler,

In function autocompleteItemFocusedHandler(event, ui) {}
can get the focused item by ui.item
first attempt is to change the label:
ui.item.label = '<a class="focused">' + ui.item.value + "</a>";
however, it's not ok

also, i wanted to use jquery addClass() but never manage to do so

full playground:
https://jsfiddle.net/o7g2cb7z/17/
mainly css line 24, javascript line 84-86, 106

glad to see any advice

1

There are 1 best solutions below

2
Arg0n On BEST ANSWER

Try using the class set by jQuery:

.ui-state-focus {
    font-size: 16px;
}

(Instead of li.focused)

Fiddle