JSFiddle - React, Tailwind, and code Playground

by Jason

HTML

<div class="box">
<p class="boxheading">Location</p>
<div style="height:5px;"> </div>
<div class="right-box" style="font-weight:bold;font-size:12px;position: relative; float: left; width: 110px;">   Area/Length : </div>
<div class="right-box" style="font-size:0.85em;position: relative;margin-left:90px;">   6 miles </div>
<div class="right-box" style="font-weight:bold;font-size:12px;position: relative; float: left; width: 90px;">   Latitude : </div>
<div class="right-box" style="font-size:0.85em;position:relative;margin-left:90px;"> 29.081665 </div>
<div class="right-box" style="font-weight:bold;font-size:12px;position: relative; float: left; width: 90px;">   Longitude : </div>
<div class="right-box" style="font-size:0.85em;position:relative;margin-left:90px;"> -81.57699 </div>
<div style="height:5px;"> </div>
</div>

<div id="latlonwx"></div>

JavaScript

var lat = $( ".right-box:contains('Latitude :')" ).next();
var lon = $( ".right-box:contains('Longitude :')" ).next();

var wxurl = "http://mobile.weather.gov/index.php?lat="+$.trim(lat.text())+"&lon="+$.trim(lon.text());

$("#latlonwx").append("<a href="+wxurl+" target=\"blank\">Rec Location Weather</a>");