title: jQuery attribute question
body: <p>I'm trying to select a series of divs one at a time.  I'm sure theres a better way to do this, but I gave them all unique rels and I'm using the rels to select them one at a time.  I want to move them over the width of the div, then animate it dropping down the screen. What I have is:</p>
  
  <pre><code>    $(document).ready(function(){
          var totalbricks = 7;
          var index = 2;
          $(".brick").animate({top:"600px"});
          while(index &lt; totalbricks)
          {
              var postion = 45*index;
              $(".brick[rel='+index+']").css('left', postion+'px');
              $(".brick[rel='+index+']").animate({top:"600px"});
              index++;
          }
   });
  </code></pre>
  
  <p>All the divs are in a container div.<br>
  Jquery docs say, 'Variables can be used using the following syntax: [name='" +MyVar+ "']'<br>
  What am I doing wrong?</p>
  
  <hr />
  
  <p>Here is the HTML that is being used by the jQuery</p>
  
  <pre><code>    &lt;body&gt;
  &lt;div id="container"&gt;
      &lt;div id="canvas"&gt;
          &lt;div class="brick" rel="1"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="2"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="3"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="4"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="5"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="6"&gt;
          &lt;/div&gt;
          &lt;div class="brick" rel="7"&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  </code></pre>