jQuery find every focusable elements

When build accessible websites, you often need to find the first focusable element within a container. To make the code cleaner and reusable I build a small jQuery selector that can be added to every project.

The code

jQuery.extend(jQuery.expr[':'], {
    focusable: function(el, index, selector){
    return $(el).is('a, button, :input, [tabindex]');
    }
});

How it works

The code above add a new jQuery selector, so you'll be able to select focusable elements with this:

$('#my-container').find(':focusable')

This code will select every elements in the container and check if it is focusable. It will return only the focusable elements.

Source

https://github.com/turcottedanny/jquery-focusable