JSFiddle - React, Tailwind, and code Playground

HTML

1. Be<span class="shuffle">nilr</span><br>
2. <span id="shuffle2">eB</span><br>
3. <span id="berlin">Be</span>

CSS

.shuffle{
    direction: rtl;
    unicode-bidi: bidi-override;
}

#shuffle2::before, #shuffle2{
    content: "nilr";
    direction: rtl;
    unicode-bidi: bidi-override;
}

#berlin::after {
    content: "rlin";
}