使用jquery应用转换

Question

我想在鼠标点击时对列表项应用转换。我想使用动画顺利滚动列表。我想用转换动画

jQuery(document).ready(function($){
 $('.flex-next').click(function(){
  $('.thumbnailIcon').each(function(index, item){
  	var fourthLi = $(item).find("li:nth-child(4)");
    var secondLi = $(item).find("li:nth-child(2)");
	 $(secondLi).before(fourthLi).animate();
  });

 });
$('.flex-prev').click(function(){
  $('.thumbnailIcon').each(function(index, item){
   	var fourthLi = $(item).find("li:nth-child(2)");
    var secondLi = $(item).find("li:nth-child(4)");
	  $(secondLi).after(fourthLi);
  });

 });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="parent flex-active-slider">
<div class="node_id"><span>233</span></div>
<ul class="thumbnailIcon">
  <li>left 0</li>  
  <li class="69"> 1</li>
  <li class="233">2</li>
  <li class="299"> 3</li>
  <li>right 4</li>  
</ul> 
</li>
<li class="parent">
<div class="node_id"><span>2</span></div>
<ul class="thumbnailIcon">
  <li>left 0</li>  
  <li class="69">1</li>
  <li class="233">2</li>
  <li class="299">3</li>
  <li>right 4</li>  
</ul> 
</li>
<a  class="flex-prev">prev<a>
<a  class="flex-next">next<a>