JSFiddle - React, Tailwind, and code Playground

HTML

<h2>Click to Camelize Class</h2>

<a id="camelize">An anchor</a>

CSS

html {
    font-family:'verdana'
}
h2 {
    color: maroon;
}

JavaScript

$(document).ready(function () {
    $('a').button();

    $('#camelize').click(function () {
        $('*[class^=ui-]').toggleClass(function (index, classNamesToChange) {
            $.each(classNamesToChange.split(' '), function(index, classNameToChange){
                return classNameToChange[3].toLowerCase() + classNameToChange.replace(/-([a-z])/g, function (a, b) {
                    return b.toUpperCase();
                }).slice(3); 
                
               // Uncomment these to test
               // console.log('Before' + classNameToChange);
               // console.log('Now' + classNameToChange[3].toLowerCase() + classNameToChange.replace(/-([a-z])/g, function (a, b) {
                    // return b.toUpperCase();
               // }).slice(3)); 
            });                        
        })
    });
});