Как сделать автопрокрутку слайдера по классу?

<ul class="slides">
 <input type="radio" name="radio-btn" id="img-1" checked="">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"><img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-7" class="prev">‹</label> <label for="img-2" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-2">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"> <img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-1" class="prev">‹</label> <label for="img-3" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-3">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"> <img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-2" class="prev">‹</label> <label for="img-4" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-4">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"><img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-3" class="prev">‹</label> <label for="img-5" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-5">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"><img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-4" class="prev">‹</label> <label for="img-6" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-6">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"><img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-5" class="prev">‹</label> <label for="img-7" class="next">›</label>
	</div>
 </li>
 <input type="radio" name="radio-btn" id="img-7">
	<li class="slide-container">
	<div class="slide">
 <a href="ссылка"><img src="изображение"></a>
	</div>
	<div class="nav">
 <label for="img-6" class="prev">‹</label> <label for="img-1" class="next">›</label>
	</div>
 </li>
	<li class="nav-dots"> <label for="img-1" class="nav-dot" id="img-dot-1"></label> <label for="img-2" class="nav-dot" id="img-dot-2"></label> <label for="img-3" class="nav-dot" id="img-dot-3"></label> <label for="img-4" class="nav-dot" id="img-dot-4"></label> <label for="img-5" class="nav-dot" id="img-dot-5"></label> <label for="img-6" class="nav-dot" id="img-dot-6"></label> <label for="img-7" class="nav-dot" id="img-dot-7"></label> </li>
</ul>