JSFiddle - React, Tailwind, and code Playground

HTML

<div id="original-content">
      <h2><a name="top">This is a heading</a></h2>
      <h3>This is a sub-heading</h3>
      <p>A paragraph may contain <a href="http://google.com/">Hyperlinks</a> or other elements such as:</p>
      <ul>
          <li>List items</li>
          <li>Words with <span style="color:green">span styles</span> applied</li>
          <li>etc.</li>
      </ul>
      <p>You may also have form elements within tables, such as:</p>
      <table>
          <tr>
              <td>Input Text</td>
              <td><input type="text" value="input text would belong here" /></td>
          </tr>
          <tr>
              <td>Radio Buttons:</td>
              <td>
                  <label><input type="radio" name="radio1" /> Radio option 1</label><br />
                  <label><input type="radio" name="radio1" /> Radio option 2</label>
                  <label><input type="radio" name="radio1" /> Radio option 3</label>
              </td>
          </tr>
          <tr>
              <td>Textarea</td>
              <td><textarea name="text">Some piece of text area text would belong here.</textarea></td>
          </tr>
      </table>
    </div>
    <p>Short words that should just work:</p>
    <ul>
      <li>hard</li>
      <li>work</li>
    </ul>
    <p>Words this make trip up on:</p>
    <ul>
      <li>peel</li>
      <li>seek</li>
    </ul>
    <p>Words it needs to have exceptions for:</p>
    <ul>
      <li>feeling</li>
      <li>cookies</li>
    </ul>
  </body>

CSS

h2 { font-size: xx-large; font-weight: bold; }
h3 { font-size: x-large; text-decoration: underline; }
p { margin: 10px 0; text-indent: 10px; }
ul { list-style-type: circle; margin: 10px 25px; padding: 10px; }

JavaScript

function t(e){
      var r=[],w;
      for(w=0;w<e.length;w++){
        if(e[w].nodeType===3)r.push(e[w]);
        else if(e[w].childNodes)r=r.concat(t(e[w].childNodes));
      }
      return r;
    }
    var x=t(document.body.childNodes);
    for(var y=0;y<x.length;y++){
      x[y].data=x[y].data.replace(/\b[a-z]{4,}\b/ig,function(w){
        if(w.length==4&&(/^.([a-z])\1./i).test(w))
          return w;
        var e=w;
        while (e==w){
          var x=w.split('');
          e=x[0]+(x.slice(1,x.length-1).sort(function(a,b){
            return(Math.random()*2)>1?1:-1;
          }).join(''))+x[x.length-1];
        }
        return e;
      });
    }