jquery .focus not working for input:first

Question

We are having an issue where when we open a modal window we are trying to set the focus to the first input element in the modal that is not of type hidden. here is what we are trying: ``` $("#test-overlay input[type!=hidden]:first").focus(); ``` However, this call works: ``` $("#test-overlay #loginInput").focus(); ``` The input field has an id of loginInput. Any thoughts?

Accepted Answer

The problem is due to the order of precedence in which jQuery interprets the selector. Try the following:

```
$('#test-overlay input').not('[type=hidden]').first().focus();
```

This has the added benefit of not using the `:first` and attribute not equal to selectors since they're jQuery specific and queries using these cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.

jquery .focus not working for input:first

Solution

Problem