JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css">
<link rel="stylesheet" href="http://openlayers.org/dev/theme/default/style.css">
<script src="http://openlayers.org/dev/OpenLayers.js"></script>
<div id="map" class="smallmap"></div>

JavaScript

var map, layer;
map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.WMS("OpenLayers WMS",
    "http://vmap0.tiles.osgeo.org/wms/vmap0", {
    layers: 'basic'
});
map.addLayer(layer);
map.setCenter(new OpenLayers.LonLat(0, 0), 0);
var markersLayer = new OpenLayers.Layer.Markers("Markers");
map.addLayer(markersLayer);
var size = new OpenLayers.Size(21, 25);
var offset = new OpenLayers.Pixel(-(size.w / 2), -size.h);
var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png', size, offset);


marker = new OpenLayers.Marker(new OpenLayers.LonLat(12.5, 16.5), icon);

markersLayer.addMarker(marker);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.zoomToMaxExtent();

marker.events.register('click', marker, function (evt) {
    alert("lon: "+evt.object.lonlat.lon+" , lat: "+evt.object.lonlat.lat);
});