title: Why doesn't the for-loop make my wishes coming true?
body: <p>Ok, Simply... I want to make this (which works perfectly, but is obviously too much writings when i have #b up to #b20):</p>
  
  <pre><code>$("#b" + 1).click(function () {
      $('.c').hide();
      $(".a" + 1).show();
  });
  $("#b" + 2).click(function () {
      $('.c').hide();
      $(".a" + 1).show();
  });
  </code></pre>
  
  <p>Simple, like this:</p>
  
  <pre><code>for (var i = 0; i &lt; 50; i += 1) {
      $("#b" + i).click(function () {
          $('.c').hide();
          $(".a" + i).show();
          alert('Hey'+i);
      });
  }
  </code></pre>
  
  <p><strong>$("#b" + i)</strong> is button on htmlpage, and     <strong>$(".a" + i)</strong> is the text which is supposed to be viewed on the page by clicking on the button. 
  //So the text is with <em>class="c a1"</em>, <em>class="c a2"</em>, ...; and the button is with <em>id="#b1"</em>, <em>id="#b2"</em>...
  But when I execute the code (Click on #b1, #b2, or...), .c hides (as expected), and the next step is only executed for i=50 (proved with the alert).</p>
  
  <p>Any ideas?</p>