JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="input" name="first" /></br>
<input type="text" id="input" name="second" /></br>
<input type="text" id="input" name="third" /></br>
<input type="text" id="input" name="fourth" /></br>
<input type="text" id="input" name="fifth" /></br>
</br>
<button name="sort" id="sort">Click Here To Sort</button>
</br>
<div id="results">
    
</div>

CSS

li {
    float: left;
    width: 50px;
    margin-left: 50px;
}

JavaScript

$('#sort').click(function(){
    var first = $('input[name="first"]').val();
	var second = $('input[name="second"]').val();
	var third = $('input[name="third"]').val();
	var fourth = $('input[name="fourth"]').val();
	var fifth = $('input[name="fifth"]').val();
    $('#results').append('<ul><li>'+first+'</li><li>'+second+'</li><li>'+third+'</li><li>'+fourth+'</li><li>'+fifth+'</li></ul>');
	$($('#results').find('ul').get().reverse()).each(function(){
		$(this).replaceWith($('<marquee><ol>'+$(this).html()+'</ol></marquee>'))
	});
});