title: How to get data from webservice in jquery?
body: <p>I have a web service with link: <code>http://41.128.183.109:9090/api/data/getalllocations</code></p>
  
  <p>I recived this data in dropdown using jquery .this data contains 2 objects <code>LocationName</code> and <code>LocID</code>. I want to display an alert with <code>LocID</code> in dropdown change function in jQuery. Here is my code:</p>
  
  <pre><code>$(document).ready(function () {
      $.ajax({
          type: 'Get',
          url: 'http://41.128.183.109:9090/api/data/getalllocations',
          success: function (data) {
              var SubDropdown = $("#main");
              for (var i = 0; i &lt; data.length; i++) {
                  SubDropdown.append('&lt;option value?' + i + '?=""&gt;' + data[i].LocationName + '&lt;/option&gt;');
              }
          }
      });
  });
  
  $("#countries").change(function () {
      alert();
  });
  </code></pre>
  
  <p>Here is my HTML code :</p>
  
  <pre><code>&lt;select tabindex="-1" class="select2_group form-control" style="display: normal; width: 290px;" name="countries" id="countries"&gt;
      &lt;optgroup label="Select Your City" id="main"&gt;&lt;/optgroup&gt;
  &lt;/select&gt; 
  </code></pre>