control-freak-ide/Control-Freak-Documentation/jQuery/docs/entries/first-child-selector.json

{"name":"first-child","type":"selector","title":":first-child Selector","deprecated":null,"removed":null,"desc":"Selects all elements that are the first child of their parent.","categories":["selectors/child-filter-selectors","version/1.1.4"],"entries":[{"return":"","signatures":{"added":"1.1.4"},"examples":{"desc":"Finds the first span in each matched div to underline and add a hover state.","code":"\n$( \"div span:first-child\" )\n  .css( \"text-decoration\", \"underline\" )\n  .hover(function() {\n    $( this ).addClass( \"sogreen\" );\n  }, function() {\n    $( this ).removeClass( \"sogreen\" );\n  });\n","css":"\n  span {\n    color: #008;\n  }\n  span.sogreen {\n    color: green;\n    font-weight: bolder;\n  }\n","html":"\n<div>\n  <span>John,</span>\n  <span>Karl,</span>\n  <span>Brandon</span>\n</div>\n<div>\n  <span>Glen,</span>\n  <span>Tane,</span>\n  <span>Ralph</span>\n</div>\n"},"longdesc":"\n    <p>While <a href=\"/first-selector/\">:first</a> matches only a single element, the <code>:first-child</code> selector can match more than one: one for each parent. This is equivalent to <code>:nth-child(1)</code>.</p>\n  "}],"slug":"first-child-selector"}