JSFiddle - React, Tailwind, and code Playground

by alpacalips

HTML

<!DOCTYPE html>
<html>
   <head>
      <title></title>
   </head>
   <body>

       <div id="test">   
            <ul>
                <li>01. Aliquam mollis - tincidunt nulla</li>
            </ul>
       </div>
       
       <div id="holder"></div>

  </body>
</html>

CSS

#holder{
    position:absolute:
    top:10px;
    left:10px;
    
    font-family: sans-serif;
    font-size:15px;
    border: 1px solid black;
    float: left;
    white-space: nowrap;
}

p {
    clear: left;
}

JavaScript

$(document).ready(function () {
    var s = $('#test ul li').html();
    console.log(s);
    
    var holder = $('#holder');
    holder.html(s);
    
    holder.after('<p>Width: ' + holder.width() + 'px</p>');
});