JSFiddle - React, Tailwind, and code Playground

HTML

<ul class='proper-case'>
    <li><a>THE QUICK BROWN FOX IS ABOUT TO JUMP OVER THE FENCE</a></li>
    <li><a>THE QUICK BROWN FOX IS ABOUT TO JUMP OVER THE FENCE</a></li>
    <li><a>THE QUICK BROWN FOX IS ABOUT TO JUMP OVER THE FENCE</a></li>
    <li><a>THE QUICK BROWN FOX IS ABOUT TO JUMP OVER THE FENCE</a></li>
    <li><a>THE QUICK BROWN FOX IS ABOUT TO JUMP OVER THE FENCE</a></li>
</ul>

JavaScript

$('ul.proper-case li a').each(function(){
    var ele = $(this);
    ele.text(toProperCase(ele.text())); 
}); 

function toProperCase(str)
{
    var noCaps = ['of','a','the','and','an','am','or','nor','but','is','if','then', 
'else','when','at','from','by','on','off','for','in','out','to','into','with'];
    return str.replace(/\w\S*/g, function(txt, offset){
        if(offset != 0 && noCaps.indexOf(txt.toLowerCase()) != -1){
            return txt.toLowerCase();    
        }
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
    });
}