:firstS2C Home « Selectors « :first

First element match selector.

Shorthand version $(':first')


The :first selector, selects the first matched element.

Unlike the :first-child element this selector will only ever return one element.

Being a jQuery extension the :first pseudo selector is not part of any current CSS specification. Therefore :first cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.


Signature Description
jQuery(':first')First element match





:first ExampleTop

Selects first matched element.

In the example below we apply an orange background to first 'td' element of the tables marked with a class of 'javatable'. So the table below will not be selected but the Syntax table above will be.

First Element Selector Has No Effect on this table
Table Row 1, Table Data 1 Table Row 1, Table Data 2
Table Row 2, Table Data 1 Table Row 2, Table Data 2

  $('#btn18').on('click', function() {
    $(".javatable td:first").css('backgroundColor', 'orange');

Press the button below to action the above code: