title: Jquery text field auto complete
body: <p>Hello guys so I have the following issue.</p>
  
  <p>I have the following autocomplete made for myself and I want when the user enters <code>invalid city</code> to show under the textbox <code>"no match found"</code> or <code>"no city found"</code> etc. </p>
  
  <p>Here is my Jquery.</p>
  
  <p><strong>(P.S.)</strong> I need it to work without any autocomplete plugins etc. </p>
  
  <pre><code>$('.form-control').keyup(function(e){
      e.preventDefault();
      $.ajax({
          method: "GET",
          url: "https://api.teleport.org/api/cities?search=" + $('.form-control').val(),
  
  }) .done(function(data){
          if(typeof data._embedded["city:search-results"][0] === 'undefined') {
              $('#datalist').append('Please select a valid value.');
          } else {
      console.log(data._embedded["city:search-results"][0].matching_full_name);
      $('option:eq(0)').remove();
      $('#datalist').append('&lt;option value="' + data._embedded["city:search-results"][0].matching_full_name + '"&gt;');
  }
  
  });
  });
  </code></pre>