JSFiddle - React, Tailwind, and code Playground
HTML
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
JavaScript
$("div").html(function (i, t) {
i++;
var str = i.toString().slice(-1),
suffix = '';
switch (str) {
case '1':
suffix = i.toString().slice(-2) === '11' ? 'th': 'st';
break;
case '2':
suffix = i.toString().slice(-2) === '12' ? 'th' : 'nd';
break;
case '3':
suffix = i.toString().slice(-2) === '13' ? 'th' : 'rd';
break;
case '4':
case '5':
case '6':
case '7':
case '8':
case '9':
case '0':
suffix = 'th';
break;
}
return i + '<span>' + suffix + '</span>';
});