jQuery日本語リファレンス

jQuery does not mean Japanese Query...

Selectors/API/jQuery

:first-child

各親要素の最初の子要素を選択します。

:firstセレクターが要素集合のうちから先頭のひとつだけを選択するのに対し、:first-childは親要素毎に最初の子要素を選択します。
サンプル
サンプル1
div要素内にある最初のspan要素に対して下線を付けるなどします。
一方、:firstセレクターで選択された要素に対しては背景を黄色くします。挙動の違いを確認してください。
<div>
  <span>John,</span>
  <span>Karl,</span>
  <span>Brandon</span>
</div>
<div>
  <span>Glen,</span>
  <span>Tane,</span>
  <span>Ralph</span>
</div>
$("div span:first-child")
    .css("text-decoration", "underline")
    .hover(function () {
          $(this).addClass("sogreen");
        }, function () {
          $(this).removeClass("sogreen");
        });
 
$("div span:first")
    .css("background-color", "yellow");
[全コードを表示] [実行結果を単体で表示]