How to select specific Child Node in HTML Dom with JQuery Selectors?

Question

I have these two HTML DOM examples and i want to know, how i can navigate to each checkbox, if i start my traversing at the node ?

DOM Example One:

<div class="box1 margin">
    <h3>Some Checkboxes</h3>
       <input type="checkbox">
       Nr. 1
       <br>
       <input type="checkbox">
       Nr. 2
       <br>
       <input type="checkbox">          
</div>

DOM Example Two:

<div>
   <h3>Some Checkboxes </h3>
     <div class="box1 margin">       
         <input type="checkbox">
         Nr. 1
         <br>
         <input type="checkbox">
         Nr. 2
         <br>
         <input type="checkbox">          
     </div>
     <div class="box1 margin">
        <input type="checkbox">
        Nr. 3
        <br>
        <input type="checkbox">
        Nr. 4
        <br>
        <input type="checkbox">          
     </div>
</div> 

With navigate to each checkbox i mean the selection of this element and i want to select the checkbox !

Answer 1

You can use each() function of jquery

Following code may help you..

$(document).ready(function(){ 
  $('.box1').children('input[type="checkbox"]').each(function(){
    console.log($(this));
  });
});