The :first-child selector selects all HTML elements of a specified type that are also the first child of their parent element.

In the below example, if the first child of the parent element is NOT a paragraph, it will not be selected. Don’t confuse this by thinking that the first paragraph of the parent will be selected. It is only selected if it is ALSO the first child of the parent.

// selects every HTML paragraph that is also the first child of its parent
$('p:first-child')

---

To select multiple HTML elements with varying ids and classes, separate them with commas. The following will select 4 different elements based on their ID, class, or tag.

$('#intro, #footer, .my_paragraphs, h3')

To be more specific when selecting an HTML element, you can refer to the element and an ancestor element.

// all .child elements that live within a .father element
$('.father .child')

// all h1 tags that live within a .father element
$('.father h1')

Notice that there is no comma between the classes (but there is a space), which says you are targeting the class .child and it must have an ancestor with the class .father, as shown in the first example. You can include as many ancestors as necessary to be as specific as necessary.

// all p tags that live within a .child element that lives within a .father element
$('.father .child p')

---