JSFiddle - React, Tailwind, and code Playground
HTML
<div id ="selectable1">
<span style="position: absolute; top: 49px; left: 393px; font-size: 106px; font-family: 'adage-script-1','adage-script-2'; color: rgb(245, 5, 17); text-shadow: -2px 1px 2px rgb(51, 51, 51); -moz-transform: rotate(348deg); z-index: 95;">Adage</span>
<span style="position: absolute; top: 185px; left: 175px; font-family: Georgia; font-size: 67px; color: rgb(0, 0, 0); word-spacing: 0px; z-index: 98; width: 600px; text-align: left; opacity: 1;">Georgia</span>
<span style="position: absolute; top: 285px; left: 175px; font-family: Times New Roman; font-size: 67px; color: rgb(0, 0, 0); word-spacing: 0px; z-index: 98; width: 600px; text-align: left; opacity: 1;">Times New Roman</span>
</div>
<select id="family">
<option label="Verdana" value="Verdana" class="option">Verdana</option>
<option label="Arial" value="Arial" class="option">Arial</option>
<option label="Georgia" value="Georgia" class="option">Georgia</option>
<option label="Times New Roman" value="Times New Roman" class="option">Times New Roman</option>
<option label="Tangerine" value="Tangerine" class="option">Tangerine</option>
<option label="Cantarell" value="Cantarell" class="option">Cantarell</option>
<option label="Lobster" value="Lobster" class="option">Lobster</option>
<option label="Reenie Beanie" value="Reenie Beanie" class="option">Reenie Beanie</option>
<option label="Old Standard TT" value="Old Standard TT" class="option">Old Standard TT</option>
<option label="Josefin Sans Std Light" value="Josefin Sans Std Light" class="option">Josefin Sans Std Light</option>
<option label="Helvetica Neue Light" value="HelveticaNeue-Light" class="option">Helvetica Neue Light</option>
<option label="Palatino Linotype" value="Palatino...
JavaScript
$('#selectable1 span').live('mousedown', function() {
var ff = /font-family:(?:.*?);/.exec($(this).attr('style')).toString().replace('font-family:','').replace(';','');
$("#family").val($.trim(ff));
alert(ff);
});