jQuery - apply CSS to first paragraph -

i'm beginning student learning jquery, , question says:

add jquery event listener style first paragraph when mouse cursor on color brown, bold in style , underlined.

i'm trying this:

$(document).ready(function() {     $("p").first().hover(         function() {             (this).css('color','brown');             (this).css('font-weight','bold');             (this).css('text-decoration','underline');         },         function() {             (this).css('color','black');             (this).css('font-weight','normal');             (this).css('text-decoration','none');         }     ); }); 

but it's not working. p tags wrapped in different div tags, make difference? "first paragraph," think means first paragraph on page.

your code missin $ wrapper.

(this).css css method of jquery object. there trying invoke on dom element saying (this).css.

a shorthand .first() :first. can refer $("p:first").hover(

demo

$(document).ready(function() {      $("p").first().hover(          function() {             var elem = $(this);             elem .css('color','brown');             elem .css('font-weight','bold');             elem .css('text-decoration','underline');         },         function() {            var elem = $(this);             elem .css('color','black');             elem.css('font-weight','normal');             elem.css('text-decoration','none');         }     ); }); 

just extend , demonstrate question on how select first paragraph of particular div. can use selector chaining/filtering ensure intended paragraphs affected. see example , code below style targeted para of div class a.

$(document).ready(function () {      $("div.a p:first").hover(      function() {             var elem = $(this);             elem .css('color','brown');             elem .css('font-weight','bold');             elem .css('text-decoration','underline');         },         function() {            var elem = $(this);             elem .css('color','black');             elem.css('font-weight','normal');             elem.css('text-decoration','none');         } });