JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/ui-lightness/jquery-ui.css">
<div id="typehead">
The Birdsong Collective and Micropress was founded in April 2008 with four goals in mind: to foster sustained collaboration among artists, musicians and writers in the form of an ongoing workshop; to continually encourage each other to produce creative work; to host free, public events where members can showcase works in progress; and to circulate members’ creative endeavors in a low-cost, easy to reproduce, and high-frequency format. Birdsong members share commitments to social movements of feminism, anti-racism, queer positivity, class-consciousness, and DIY cultural production. These commitments inform our creative work in many ways, ranging from the concrete to the theoretical to the experimental.
</div>
CSS
.newClass {
left: 0px;
top: -1px;
color: red;
position:relative;
-webkit-transform: rotate(-5deg);
-moz-transform: rotate(-5deg);
}
JavaScript
function randomLetter(cased){
// case = true for uppercase, false for lowercase
var base = (cased) ? 65 : 97;
// convert HTML escape code into a letter
var rand = $('<span>&#' + parseInt(base+(Math.random()*26),10) + ';</span>');
return rand.text();
}
$(document).ready(function(){
var ltr = randomLetter(false);
var reg = new RegExp( ltr, 'g');
$('#typehead').html(function(i,html){
return html.replace(reg, '<span class="newClass">' + ltr + '</span>');
});
})