JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="&quot;http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.css">
<script src="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.js"></script>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://www.free-map.org.uk/0.6/js/lib/Ajax.j"></script>
<body onLoad="init()">
<h1>Leaflet Test</h1>
<form>
<input type="text" value="NY" name="region" id="input">
<input type="button" onClick="changeView()" name="mySubmit" value="Button">
</form>
<div id="map1" style="width:800px; height:600px"> </div>
</body>
</html>

JavaScript

function init()
{
    var map = new L.Map ("map1");
    var attrib="Hello ";
    var layerOSM = new L.TileLayer
        ("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
            { attribution: attrib } );map.addLayer(layerOSM);
	var pos = new L.LatLng(50.908,-1.4);
	map.setView(pos, 14);
    var marker = new L.Marker(pos);
    map.addLayer(marker);
}

function changeView(){
	var region = document.getElementById('input').value;
	$.ajax({
    type: 'GET',
    url: 'webservice.php',
    data: {region: region},
    success: function(response, textStatus, XMLHttpRequest) {  
	alert(region+response[0].lat+response[0].lon);
	layerOSM = "testing";
	map.addLayer(layerOSM);
	map.setView(response[0].lat, response[0].lon, response[0], 13);		
    }
});
}