JSFiddle - React, Tailwind, and code Playground

by John Doe

HTML

<h3>Client side IP geolocation using <a href="http://ipinfo.io">ipinfo.io</a></h3>

<hr/>
<div id="ip"></div>
<div id="address"></div>
<hr/>Full response: <pre id="details"></pre>

 <input id="city" name="city" type="text" class="required" title="This is a required field">

JavaScript

$.get("http://ipinfo.io", function (response) {
    $("#ip").html("IP: " + response.ip);
    $("#address").html("Location: " + response.city + ", " + response.region);
    
    //$("#city").append($("<input>").attr( + response.city);
    
    var countryData = $.fn.intlTelInput.getCountryData(),
  		telInput = $("#customerphone"),
  		countryDropdown = $("#country");
  		city = $("#city");
  
  // populate the country dropdown
	$.each(countryData, function(i, country) {
  addressDropdown.append($("<option></option>").attr("value", country.iso2).text(country.name));
    
    
    $("#details").html(JSON.stringify(response, null, 4));
}, "jsonp");