title: How to concatenate variable and string in JavaScript?
body: <p>Please don't immediately mark this as a duplicate. I've looked at similar questions but still can't figure this out.</p>
  
  <p>This is what I have currently:</p>
  
  <pre><code>$(document).ready(function(){
      for(var i=1;i&lt;2;i++)
      {
          $("#MenuBarButton"+i).mouseover(function(){
              $("#ldheMenuBarLayer"+i).stop().animate({height:'66px'},{queue:false, duration:600, easing: 'easeOutBounce'})
          });
          $("#MenuBarButton"+i).mouseout(function(){
              $("#ldheMenuBarLayer"+i).stop().animate({height:'41px'},{queue:false, duration:600, easing: 'easeOutBounce'})
          });
      }
  });
  </code></pre>
  
  <p>That doesn't work. Nothing happens and nothing appears in the console. But if I directly replace the <code>i</code> with a <code>1</code> in each of the <code>$</code> function things it works.</p>
  
  <p>I'm not new to programming but I'm new to JavaScript, so am I doing something obviously wrong? Thanks!</p>
  
  <p><strong>EDIT:</strong> When I say I replace the <code>i</code> with a <code>1</code>, that's because the IDs are <code>MenuBarButton1</code> and <code>ldheMenuBarLayer1</code>.</p>