title: Drop down Item Text Change on selection
body: <p>I have tried working on this simple <a href="http://jsfiddle.net/JAwxq/3/" rel="nofollow">javascript</a>. The dropdown group btn on selecting the value from the drop down menu must change its text to the selected value.But it doesn't change the text from the javascript code below:</p>
  
  <pre><code>$(document).ready(function(){
  var d=new Date(); 
  var year = ["2013","2014"];
  var monthNames = [ "January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December" ];
  
  
  
  
  for(i=0; i&lt;monthNames.length; i++){
  
      $("#dd1").append("&lt;li&gt;&lt;a href=''&gt;"+monthNames[i]+"&lt;/a&gt;&lt;/li&gt;");
  $("#dd2").append("&lt;li&gt;&lt;a href=''&gt;"+monthNames[i]+"&lt;/a&gt;&lt;/li&gt;");
  }
  });
  </code></pre>
  
  <p>and the corresponding HTML code is given below:</p>
  
  <pre><code>   &lt;div class="well carousel-search hidden-phone"&gt;
                  &lt;div class="btn-group"&gt;
                      &lt;a id = 'test1'class="btn dropdown-toggle btn-select" data-toggle="dropdown" href="#"&gt;Choose Month 1 &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
                      &lt;ul id = "dd1" class="dropdown-menu"&gt;&lt;/ul&gt;
                  &lt;/div&gt;
  
                  &lt;div class="btn-group"&gt;
                      &lt;a  id = 'test'  class="btn dropdown-toggle btn-select2" data-toggle="dropdown" href="#"&gt;Choose Month 2 &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
                      &lt;ul id = "dd2" class="dropdown-menu"&gt;&lt;/ul&gt;
                  &lt;/div&gt;
  
              &lt;/div&gt;
  </code></pre>