JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://flexslider.woothemes.com/js/jquery.flexslider.js"></script>
<div class="slider">
    <ul class="slides">
        <li>
            <div>&nbsp;</div>
        </li>
        <li>
            <p>&nbsp;</p>
        </li>
    </ul>
</div>

<a href="#" class="prev" >Prev</a>
<a href="#" class="next">Next</a>

CSS

* {margin: 0; padding: 0; }
div { width: 100px; 100px; background-color: #000; } 
p { width: 100px; height: 100px; background-color: #333; } 
.slider { position: relative; }  
li { width: 100px; height: 100px; } 
li + li { display: none; }

JavaScript

$('.slider').flexslider({
    directionNav: false,
    contolNav: false
})

$('.prev').on('click', function(){
    $('.slider').flexslider('prev')
    return false;
})

$('.next').on('click', function(){
    $('.slider').flexslider('next')
    return false;
})