прикрутить "пагинацию" к простому слайдеру?
 

Здравствуйте. Требуется подсказка JS программистов. Есть самый простой слайдер. Внизу есть кнопки пагинации, но они не работают.
Как прикрутить эти кнопки, чтобы они реагировали на слайдер и переключали его?
Помогите, пожалуйста.

jQuery(document).ready(function(){
	
//// ---> Проверка на существование элемента на странице
jQuery.fn.exists = function() {
   return jQuery(this).length;
}

//// ---> Слайдер
$(function(){
  if($('.slider').exists()) {

    $('.slider').each(function(){

      var slider = $(this);

      var slideWrap = slider.find('.slide-wrap'),
          nextLink = slider.find('.next-slide'),
          prevLink = slider.find('.prev-slide'),
          slideWidth = slider.find('.slide-item').outerWidth(),
          scrollSlider = slideWrap.position().left - slideWidth;

      /* Клик по ссылке на следующий слайд */
      nextLink.click(function(){
        if(!slideWrap.is(':animated')) {
          slideWrap.animate({left: scrollSlider}, 500, function(){
            slideWrap
              .find('.slide-item:first')
              .appendTo(slideWrap)
              .parent()
              .css({'left': 0});
            });
          }
       });

      /* Клик по ссылке на предыдующий слайд */
      prevLink.click(function(){
      if(!slideWrap.is(':animated')) {
        slideWrap
          .css({'left': scrollSlider})
          .find('.slide-item:last')
          .prependTo(slideWrap)
          .parent()
          .animate({left: 0}, 500);
        }
      });

    });

  }

});

});

<div class="slider">
		<div class="slide-list">
			<div class="slide-wrap">
				<div class="slide-item #slide0">
					<img alt="" src="http://www.howtomake.com.ua/wp-content/uploads/2012/07/img-1.jpg">
					<span class="slide-title">Первый слайд</span>
				</div>
				<div class="slide-item">
					<img alt="" src="http://www.howtomake.com.ua/wp-content/uploads/2012/07/img-2.jpg">
					<span class="slide-title">второй слайд</span>
				</div>
				<div class="slide-item">
					<img alt="" src="http://www.howtomake.com.ua/wp-content/uploads/2012/07/img-3.jpg">
					<span class="slide-title">Третий слайд</span>
				</div>
				<div class="slide-item">
					<img alt="" src="http://www.howtomake.com.ua/wp-content/uploads/2012/07/img-4.jpg">
					<span class="slide-title">Четвертый слайд</span>
				</div>
				<div class="slide-item">
					<img alt="" src="http://www.howtomake.com.ua/wp-content/uploads/2012/07/img-5.jpg">
					<span class="slide-title">Пятый слайд</span>
				</div>
			</div>
			<div class="clear"></div>
		</div>
		<div class="navy prev-slide" name="prev"></div>
		<div class="navy next-slide" name="next"></div>
	</div>
 *!*<!--НЕ работает!-->
<p class="nav">
<a href="#slide0" id="slide0" class="">1</a>
<a href="#slide1" id="slide1" class="">2</a>
<a href="#slide2" id="slide2" class="">3</a>
</p> */!*

Вот демо работы слайдера(пагинация не работает)
https://jsfiddle.net/ud41ds8m/8/


Помогите, пожалуйста.