Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery :nth-child() selector

Hi please look at the HTML below. I am trying to use jQuery to get every 3rd instance on the DIVs with class="box" contained within the DIV with class="entry" to have a no right hand margin:

My HTML code:

<div class="entry">

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box I Want to remove right hand margin on this div -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box I Want to remove right hand margin on this div -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box -->

    <div class="box">
        SOME HTML....
    </div><!-- end .box I Want to remove right hand margin on this div -->

    </div>
    <!--end entry-->

My attempt with jQuery:

   <script>
        $(document).ready(function(){
            $("div.entry:nth-child(3)").css("margin", "0px");
        });
   </script>

I can't get this working can anyone please help? Thanks in advance!


thanks to all who helped the solution provided is indeed correct. I am coding up a supplied template and found that JQuery had been set to run in compatibility mode hence $ was the problem.

like image 248
mtwallet Avatar asked Jan 08 '10 10:01

mtwallet


2 Answers

From the docs (my emphasis)

Matches all elements that are the nth-child of their parent or that are the parent's even or odd children.

You're currently selecting the parent, while you should be selecting children:

$("div.entry > div:nth-child(3)").css("margin", "0px");
like image 164
David Hedlund Avatar answered Oct 17 '22 17:10

David Hedlund


nth-child also seems to be non-0 indexed. Keep that in mind if you're used to indexing at 0.

like image 41
Boris Lutskovsky Avatar answered Oct 17 '22 17:10

Boris Lutskovsky