JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
<div class="cycle" >
<!-- empty element for overlay -->
<div class="cycle-overlay"></div>

<ul>
<li>
<h1>Raquette Lake</h1>
<p>Adirondack State Park</p>
<img src="http://jquery.malsup.com/cycle2/images/p1.jpg" />
</li>

<li>
<h1>Raquette Lake</h1>
<p>Adirondack State Park</p>
<img src="http://jquery.malsup.com/cycle2/images/p2.jpg" />
</li>

<li>
<h1>Raquette Lake</h1>
<p>Adirondack State Park</p>
<img src="http://jquery.malsup.com/cycle2/images/p4.jpg" />
</li>
</ul>


</div>

JavaScript

$('.cycle').cycle({
timeout: 6000,
fx: 'scrollHorz',
slides:'li'                
});