JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
 <li>O</li>
 <li>H</li>
 <li>A</li>
 <li>I</li>
 <li>S</li>
 <li>U</li>
 <li>P</li>
</ul>
<script src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.76.js"></script>

CSS

html { font-family: Helvetica, Arial, sans-serif; }
li { font-size: 50px; padding: 10px 20px; width: 40px; text-align: center; border: 5px solid black; }
#prev, #next { text-decoration: underline; color: #03c; }

JavaScript

var $prev = $('<span id="prev">→</span>'),
    $next = $('<span id="next">←</span>'),
    $pager = $('<span id="pager" />');
$('ul').after($prev).after($pager).after($next).cycle({ prev: $prev, next: $next, pager: $pager });