jQuery first child Selector

Last Updated Jul 27, 2015, 04:50:56 PM

jQuery first-child Selector

jQuery first child selector is used to select all the HTML elements which are the first child of their parent.


When there many no of elements in a page, jQuery :first-child selector can be used to select the first element of each parent in the web page. It will come in handy when you working with different web pages.


In the above HTML code we have three different div tags which has two elements in each. In the first div tag the element First Child paragraph is the first-child of its parent div.

In the second div element Apple is the first child element of it's parent div

In the third div tag First Child in Third Div is the first child element of it's parent div

Using the jQuery first-child selector see how we select the first-child elements and apply different colors to the first-child elemenets in the below jQuery example

first child example

jQuery first child selector

Try It Now

All jQuery Child Selectors

Other Advanced jQuery Selectors you might want to learn
jQuery Complete Selectors Reference

jQuery Selectors

jQuery Basic Selectors

jQuery Child Selectors

jQuery Content Filter Selectors

Sources and Credits

The content and methods in the tutorial has been referred and updated with jQuery API and The jQuery Foundation

Last Updated Jul 27, 2015, 04:50:56 PM