datalist with selected option

by tedder

HTML

<script src="https://code.jquery.com/jquery-3.1.0.slim.min.js"></script>
<input list="cities" name="city">
<datalist id="cities">
    <option value="Portland">
    <option value="San Francisco">
</datalist>
<input type="button" id="xx">

JavaScript

function init() {
  //$("input[name=city]").val('Portland');
 
   //I'd like to default to a city, ignoring that for now.
       //$('input[name=city]').find('[value="Portland"]').attr('selected', true);
 
  $('input[name=city]').click(function() {
    $('input[name=city]').empty();
  });
  $('#xx').click(function() {
    $('input[name=city]').empty();

  });

}
$(document).ready(init);