:first-child Selector

Selects all elements that are the first child of their parent.


While .first() matches only a single element, the :first-child selector can match more than one: one for each parent. This is equivalent to :nth-child(1).

Finds the first span in each matched div to underline and add a hover state.

span {
  color: #008;
span.sogreen {
  color: green;
  font-weight: bolder;
$("div span:first-child")
  .css("text-decoration", "underline")
    function () {
    function () {

Looking for a Web Developer?


Hi! I'm Basti, author of this site. If you are looking for a web developer with 15+ years of experience, holla at me!

Be it the good 'ol jQuery, vanilla JS or modern frameworks like Vue and Svelte, front- or backend, I can help you.

Just write me at jobs@jqapi.com :)