Cafés in Groningen

<!doctype html>
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css">
<style>
html, body, #map { height: 100%; margin: 0; }
</style>

var api = 'https://overpass-api.de/api/interpreter';
var query = 'area["name"="Groningen"]["admin_level"="10"];node["amenity"="cafe"](area);out;';

var map = L.map('map');

L.tileLayer('https://{s}.tile.osm.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

$.get(api, {data: query}, function(resp) {
  
  function onEachFeature(feature, layer) {
      if (feature.properties && feature.properties.tags.name) {
          layer.bindPopup(feature.properties.tags.name);
      }
  }

var geojson = osmtogeojson(resp);
  
  console.log(geojson.features[0].properties.tags.name);
  
  var layer = L.geoJson(geojson, {
    onEachFeature: onEachFeature
  }).addTo(map);
  
  map.fitBounds(layer.getBounds());
});

</script>

Updated missing url https://cdn.rawgit.com/tyrasd/osmtogeojson/2.2.5/osmtogeojson.js to https://cdn.jsdelivr.net/gh/tyrasd/osmtogeojson/2.2.5/osmtogeojson.js

https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js

https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js

https://cdn.rawgit.com/tyrasd/osmtogeojson/2.2.5/osmtogeojson.js