title: Using Array as a Dynamic JQuery String Variable Name
body: <p>Summary: I have passed the name of the id select tag into an Array. I want to dynamically assign each Select Item to display the Index of the selected item upon change. This is sent to the output div. Only the third select item is dynamically being triggered. Why?</p>
  
  <pre><code>&lt;script language="JavaScript" type="text/javascript"&gt;
  
  $(document).ready(function(){
  
  var NameOfSelect=new Array("a","b","c");
  
  for (i=0;i&lt;NameOfSelect.length;i++){
  
  var sel=NameOfSelect[i];
  $("#"+NameOfSelect[i]).change(function () {
             var str = "";
             $("#"+sel+" option:selected").each(function () {
              str += $(this).index() + " "+$("#"+sel).attr("id");
                    });
            $("#output").text(str);
         })
          .trigger('change');
  
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>The HTML</p>
  
  <pre><code>&lt;select id="a" &gt;
  &lt;option value="0a" &gt;0a&lt;/option&gt;
  &lt;option value="1a"  &gt;1a&lt;/option&gt;
  &lt;option value="2a" &gt;2a&lt;/option&gt;
  
  &lt;/select&gt;
  
  
  &lt;select id="b" &gt;
  &lt;option value="0b"  &gt;0b&lt;/option&gt;  
  &lt;option value="1b" &gt;1b&lt;/option&gt;
  &lt;option value="2b" &gt;2b&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;select id="c" &gt;
  &lt;option value="0c" &gt;0c&lt;/option&gt;
  &lt;option value="1c" &gt;1c&lt;/option&gt;
  &lt;option value="2c" &gt;2c&lt;/option&gt;
  
  &lt;/select&gt;
  &lt;div id=output&gt;&lt;/div&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>The output shows that only "C" is being triggered on change.
  Why are "a" and "b" not being similarly dynamically assigned?</p>