title: A strange phenomena using JQ selector with some variable identifiers
body: <p>I want to add come mouseover and mouseout functions to a series classes. So I use JQ selectors with variables in a loop:</p>
  
  <pre><code>for(i=1;i&lt;=2;i++){
      cid='.Cid'+i;
      ccid='.CCid'+i;
      csid='.CSid'+i;     
      $(cid).mouseover(function(){
      $(ccid).addClass("RelatedMainComment");
      $(csid).addClass("RelatedMainComment");
      });
      $(cid).mouseout(function(){
          $(ccid).removeClass("RelatedMainComment");
          $(csid).removeClass("RelatedMainComment");
      });
      }
  </code></pre>
  
  <p>But it doesn't run correctly, It seems to add the last one class, which in the example it is the class "Cid2", the mouseover ande mouseout function. So I take an another experiment:</p>
  
  <pre><code>i=1;
      cid='.Cid'+i;
      ccid='.CCid'+i;
      csid='.CSid'+i;     
      $(cid).mouseover(function(){
      $(ccid).addClass("RelatedMainComment");
      $(csid).addClass("RelatedMainComment");
      });
      $(cid).mouseout(function(){
          $(ccid).removeClass("RelatedMainComment");
          $(csid).removeClass("RelatedMainComment");
      });
      i=2;
  </code></pre>
  
  <p>it's result is same with the former one .
  besides,If the code is :</p>
  
  <pre><code>        for(i=2;i&gt;=1;i--){
      cid='.Cid'+i;
      ccid='.CCid'+i;
      csid='.CSid'+i;     
      $(".Cid"+i).mouseover(function(){
      $(".CCid"+i).addClass("RelatedMainComment");
      $(".CSid"+i).addClass("RelatedMainComment");
      });
      $(".Cid"+i).mouseout(function(){
          $(".CCid"+i).removeClass("RelatedMainComment");
          $(".CSid"+i).removeClass("RelatedMainComment");
      });
      }
  </code></pre>
  
  <p>it can't work.
  Can you explain why?</p>