JSFiddle - React, Tailwind, and code Playground

HTML

<h2 class="splitWord">Lorem Ipsum 1234567890()</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est <b class="splitWord">consequuntur</b> tenetur quae facere ipsa odit sunt dolore quasi nisi similique laboriosam nihil voluptatem beatae tempore molestias soluta qui quis cum.</p>

CSS

body {
  padding:50px;   
    font-family: Tahoma, sans-serif;
}

.splitWord .char1  {color:red;}
.splitWord .char2  {color:green;}
.splitWord .char3  {color:blue;}
.splitWord .char4  {color:yellow;}
.splitWord .char5  {color:orange;}
.splitWord .char6  {color:yellowgreen;}
.splitWord .char7  {color:cyan;}
.splitWord .char8  {color:gold;}
.splitWord .char9  {color:pink;}
.splitWord .char10 {color:magenta;}

JavaScript

// Заворачиваем буквы в span
$('.splitWord').children().andSelf().contents().each(function() {
    if (this.nodeType == 3) {
        $(this).replaceWith($(this).text().replace(/(\d)/g, "<span class='char'>$&</span>"));
    }
});

// Добавляем классы .char1, .char2, .char3, ...

$('.splitWord').each(function() {
    $('span.char', this).each(function(i) {
        i = i+1;            
        $(this).addClass('char' + i);
    });
});