title: Input text value into a multiple data list and have option to remove them?
body: <p>I have an input text box where user enter model number and the model number must be displayed in multiple data lists when user click add button. The user has must also have the option to remove the selected model number in the multiple data lists. I have created the HTML code and Javascript code, but the javascript is not adding.</p>
  
  <p>What is is the best approach to my problem? I'm very newbie to javascript.</p>
  
  <p>Hey is my code:</p>
  
  <pre><code>&lt;html lang=en&gt;
  &lt;head&gt;
  &lt;title&gt;Add To Datalist&lt;/title&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
  &lt;link href="bootstrap_3.3.7/css/bootstrap.min.css" rel="stylesheet"&gt;
  &lt;link href="bootstrap_3.3.7/fonts/font-awesome.min.css" rel="stylesheet" &gt;
  &lt;/head&gt;
      &lt;body&gt;
          &lt;div class="container"&gt;
              &lt;div class="content"&gt;
                  &lt;br/&gt;
                  &lt;div class="col-sm-6"&gt;
                  &lt;legend&gt;Compatible Devices &lt;/legend&gt;
                      &lt;input type="text" class="form-control" id="modelNo" name="modelNo" placeholder="Enter Name Here"&gt;&lt;br/&gt;
                      &lt;a href="javascript:void(0);" id="addModNo"&gt;&lt;button class="btn btn-info"&gt;Add &lt;/button&gt;&lt;/a&gt;
                      &lt;a href="javascript:void(0);" id="removeModNo"&gt;&lt;button class="btn btn-danger"&gt;Remove&lt;/button&gt;&lt;/a&gt;   
                  &lt;/div&gt;
                  &lt;div class="col-sm-6"&gt; 
                      &lt;div class="listfromPopulatedModelNumber" id="listfromPopulatedModelNumber"&gt;                                                
                          &lt;select id="listfromPopulatedModelNo" multiple="multiple" col=10 rows=10&gt;
                                  &lt;option&gt;&lt;/option&gt;
                                  &lt;option&gt;&lt;/option&gt;
                                  &lt;option&gt;&lt;/option&gt;
                          &lt;/select&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  </code></pre>
  
  
  
  <p>     </p>
  
  <p>JavaScript Code:</p>
  
  <pre><code>   &lt;script type="text/javascript"&gt;
      $(document)
              .ready(
                      function() {
                          var count = 2;
                          $("#addModNo")
                                  .click(
                                          function() {
                                              $('#listfromPopulatedModelNo')
                                                      .last()
                                                      .after(
                                                              '#modelNo');
                                              count++;
                                          });
                          $("#removeModNo").click(function() {                            
                              $('#modelNumber &gt; option:selected').remove();
                              count--;
                          });
                      });
  &lt;/script&gt;
  </code></pre>
  
  <p>All help will be appreciated.</p>