title: How to select an item from a dropdown using jQuery
body: <pre><code>&lt;div class="col-md-8"&gt;
      &lt;div class="input-group"&gt;
        &lt;input id="buttondropdownperson" name="buttondropdownperson" class="form-control" placeholder="Please select the personyou are here to see" type="text" required=""&gt;
        &lt;div class="input-group-btn"&gt;
          &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"&gt;
            &amp;lt;-
            &lt;span class="caret"&gt;&lt;/span&gt;
          &lt;/button&gt;
          &lt;ul class="dropdown-menu pull-right"&gt;
            &lt;li&gt;&lt;a href="#"&gt;Duty Officer&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;John Doe&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Phillip Smith&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Jessica Moore&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Roger Nand&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Steve Jobs&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Phil Schiller&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Carter Williams&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a href="#"&gt;Rebecca Johnson&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>In the above Boot Strap Form, when I select a person from the dropdown, I don't see the text in the "TextField" where you see it says "Please select the person..."</p>
  
  <p>I am new to Node.JS and jQUERY. How can I get the selected person from the dropdown-menu and display it on the button ?</p>
  
  <p>JSFiddle link <a href="https://jsfiddle.net/officaluseonly2015/95h49av5/1/" rel="nofollow noreferrer">https://jsfiddle.net/officaluseonly2015/95h49av5/1/</a></p>
  
  <p><a href="https://i.stack.imgur.com/foF7Q.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/foF7Q.png" alt="Example Of My Form"></a></p>