JSFiddle - React, Tailwind, and code Playground
HTML
<span style="font-family: JennaSue;visibility:hidden;"></span>
CSS
@font-face {
font-family: JennaSue;
src: url("https://dl.dropboxusercontent.com/u/98788053/School/JennaSue.ttf");
}
#element {font-family: JennaSue;font-size: 50px; }
JavaScript
window.onload = function(){
$("body").append("<span id=\"element\">Text to measure</span>");
$("body").append("<div id=\"thewidth\"></div>");
$("body").append("<input type=\"button\" value=\"Try again\" onclick=\"getWidth();\">");
getWidth();
};
function getWidth()
{
$("#thewidth").html($("#element").width()+"px");
};