first selector in jQuery with example



first selector returns the first element from the group of elements.


Example :



    <html>
    <head>
    <title>first Selector</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
    <script type="text/javascript">
    $(document).ready(function()
    {
    $("#myButton").click(function()
    {
    $("p:first").css({'font-size':'20px','background-color':'Orange'});
    });
    });
    </script>
    </head>
    <body>
    <p>This is first paragraph element.</p>
    <p>This is Second paragraph element.</p>
    <p>This is Thire paragraph element.</p>
    <p>This is fourth paragraph element.</p>
    <p>This is five paragraph element.</p>
    <button id="myButton">Click Me</button>
    <button onclick="location.reload()">Reset</button>
    </body>
    </html>
    

Demo :





In the above example, we have used first selector. First selector selects the first element from the group of elements. In above example, it selects the first p element and apply CSS to it.

0 comments:

Post a Comment