title: Randomize a sequence of div elements with jQuery
body: <p>I'm trying to do my frist steps with jQuery but I have some trouble to understand how to find a list of child elements from a div parent element. I'm used to work with ActionScript 2 and ActionScript 3 so i could mistake some concept, like what is the better way to randomize a sequence of div elements with jQuery!</p>
  
  <p>I have this simple portion of HTML code:</p>
  
  <pre><code>&lt;div class="band"&gt;
      &lt;div class="member"&gt;
          &lt;ul&gt;
              &lt;li&gt;John&lt;/li&gt;
              &lt;li&gt;Lennon&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="member"&gt;
          &lt;ul&gt;
              &lt;li&gt;Paul&lt;/li&gt;
              &lt;li&gt;McCartney&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="member"&gt;
          &lt;ul&gt;
              &lt;li&gt;George&lt;/li&gt;
              &lt;li&gt;Harrison&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="member"&gt;
          &lt;ul&gt;
              &lt;li&gt;Ringo&lt;/li&gt;
              &lt;li&gt;Starr&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have attempted some way to do that like map <strong>.member</strong> divs in one array and then changing the sort order but without success.</p>
  
  <pre><code>function setArrayElements (element_parent) {
      var arr = [];
      //alert (element_parent[0].innerHTML);
      for (var i = 0; i &lt; element_parent.children().length; i ++) {
          arr.push (element_parent[i].innerHTML);
      }
  }
  setArrayElements($(".band"));
  </code></pre>
  
  <p>when i attempted to alert <strong>element_parent[0]</strong> i thought to get the first child of my <strong>.member</strong> list of divs but it isn't.</p>
  
  <p>if i make an alert with <strong>element_parent[0].innerHTML</strong> i see that:</p>
  
  <pre><code>&lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;John&lt;/li&gt;
          &lt;li&gt;Lennon&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;Paul&lt;/li&gt;
          &lt;li&gt;McCartney&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;George&lt;/li&gt;
          &lt;li&gt;Harrison&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;Ringo&lt;/li&gt;
          &lt;li&gt;Starr&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Why?
  How can I do to get exactly one of the members like this?</p>
  
  <pre><code>&lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;Paul&lt;/li&gt;
          &lt;li&gt;McCartney&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm sure this should be easy but I just don't know how
  :(</p>
  
  <p>please help<br/>
  thanks<br/>
  vittorio<br/></p>
  
  <hr>
  
  <p>EDIT:</p>
  
  <p>Thanks for the fastness and this various ways to get the selected children, I'll take a note of these ways for the future!<br/>
  I tried this methods, but it seems I couldn't get the entire div (please tell'me if i mistake something, it' could be too much possible!!).</p>
  
  <p>I shoud get this content:</p>
  
  <pre><code>&lt;div class="member"&gt;
      &lt;ul&gt;
          &lt;li&gt;Ringo&lt;/li&gt;
          &lt;li&gt;Starr&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>but with one of this methods like <strong>$("div.band div.member:eq(2)")</strong> or the other useful ways, I get this:</p>
  
  <pre><code>alert ($('div.band div.member')[0]);
  /* result
  &lt;ul&gt;
      &lt;li&gt;Ringo&lt;/li&gt;
      &lt;li&gt;Starr&lt;/li&gt;
  &lt;/ul&gt;
  */
  </code></pre>
  
  <p>so is there a way to get the <strong>.member</strong> div container too in my node?</p>