Add list next add class

In this example below you will see how to do a Add list next add class with some HTML / CSS and Javascript

This awesome code was written by emrankhan016, you can see more from this user in the personal repository.
You can find the original code on
Copyright emrankhan016 ©


  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

  <meta charset="UTF-8">
  <title>Add list next add class</title>
      <link rel="stylesheet" href="css/style.css">



  <ul class="list">
  <li class="current">1</li>
  <li class="cls2">2</li>
  <li class="cls3">3</li>
  <li class="cls4">4</li>
  <li class="cls5">5</li>
  <li class="cls6">6</li>
  <li class="cls7">7</li>
<a href="#" id="next">next</a>
  <script src=''></script>


    <script  src="js/index.js"></script>



/*Downloaded from */

/*Downloaded from */
  // Add cuttent class
  var $lis = $('.list li'); 
  $("#next").click(function () {
    var $selected = $('.current').removeClass('current');
    ($ > 0 ? $ : $lis.first()).addClass('current');