jQuery: Difference between selectors :first, :first-child and :first-of-type?
Definition:
:first - use this selector to select first element. This selector select only one single element from all related elements available on the page.
:first-child - use this selector to select all first child elements from each parent.
:first-of-type - use this selector to select all first child elements, of a specific type, of their parent.
Demo:
SPAN Lorem ipsum dolor sit amet, consectetur adipiscing elit.
PARA Lorem ipsum dolor sit amet, consectetur adipiscing elit.
PARA Duis aute irure dolor in reprehenderit in voluptate.
PARA Lorem ipsum dolor sit amet, consectetur adipiscing elit.
PARA Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
PARA Duis aute irure dolor in reprehenderit in voluptate.
SPAN Lorem ipsum dolor sit amet, consectetur adipiscing elit.
PARA Duis aute irure dolor in reprehenderit.
PARA Duis aute irure dolor in reprehenderit.