JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="first" value="45">fortyfive</li>
    <li class="second" value='f4foo5'>45</li>
</ul>

<input value="45">
    
    <div class="container"></div>

CSS

.container { background: yellow; width: 400px; height: 300px; position: absolute; bottom: 0; }

JavaScript

var whatIsValue = $('.first').val();
var whatIsSecondValue = $('.second').attr("value");
var whatIsInputValue = $('input').val();


$('<p>'+whatIsValue+'</p>').appendTo('.container');
$('<p>'+typeof(whatIsValue)+'</p>').appendTo('.container');

$('<p>'+whatIsSecondValue+'</p>').appendTo('.container');
$('<p>'+typeof(whatIsSecondValue)+'</p>').appendTo('.container');

$('<p>'+whatIsInputValue+'</p>').appendTo('.container');
$('<p>'+typeof(whatIsInputValue)+'</p>').appendTo('.container');