title: Set Default Drop Down Value in Bootstrap
body: <p>I am new to JS and would like to set a default value when the page loads. My HTML:</p>
  
  <pre><code> &lt;!DOCTYPE html&gt;
      &lt;html&gt;
        &lt;head&gt;
          &lt;script src="js/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script src="shared/shiny.js" type="text/javascript"&gt;&lt;/script&gt;
          &lt;script src="css/bootstrap-3.3.6-dist/js/bootstrap.min.js"&gt;&lt;/script&gt;
          &lt;link rel="stylesheet" href="css/bootstrap-3.3.6-dist/css/bootstrap.min.css"&gt;
          &lt;script src="js/app.js" type="text/javascript"&gt;&lt;/script&gt;
        &lt;/head&gt;
        &lt;body&gt;
         &lt;div class="dropdown" id="country_select"&gt;
          &lt;button class="btn btn-default dropdown-toggle" type="button"
            data-toggle="dropdown"&gt;Country&lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
              &lt;ul class="dropdown-menu"&gt;
               &lt;li&gt;&lt;a href="#" country-code="C1"&gt;Country1&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#" country-code="C2"&gt;Country2&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#" country-code="C3"&gt;Country3&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
         &lt;/div&gt;
       &lt;/body&gt;
  </code></pre>
  
  <p>I have tried some suggestions from similar questions but these do not work in my case.The <a href="https://stackoverflow.com/questions/29210921/setting-default-value-in-bootstrap-drop-down">first</a> one is:</p>
  
  <pre><code>    var main = function(){
          var data_start_type = "C1";
          var $data_type_elem = $('[country-code='+data_start_type+']');
          $('#country_select li a').text($data_type_elem.text());
  
      $("#country_select li a").on("click", function () {
              var country_selected=$(this).text();
              Shiny.onInputChange('this_country', country_selected);  //send selected data to the server script
      });
  };
  
      $(document).ready(main);
  </code></pre>
  
  <p>The code above sets all the options of the drop down as 'Country1'. 
  I found <a href="https://stackoverflow.com/questions/28474857/select-default-value-in-drop-down-bootstrap-3">this</a> suggestion that I put this below my JS code but it does not set any default value. </p>
  
  <pre><code>$('#country_select li a')[2].click();
  </code></pre>
  
  <p>Could someone please point out how I can fix this?</p>