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="prev" class="prev">prev</a>
<a href="next" 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, .next').on('click', function(){
    var href = $(this).attr('href');
    $('.slider').flexslider(href)
    return false;
})