Question: I'm making a web-based quiz. 
When I press an answer I want the count at the top to change to the next, however it keeps skipping one digit, jumping to the next (e.i. from I to III, instead of I to III).
What am I doing wrong?

Site: <http://www.carlpapworth.com/friday-quiz/#>

Html:

```
<ul id="count">
                <li><h4>I</h4></li>
                <li><h4>II</h4></li>
                <li><h4>III</h4></li>
                <li><h4>IV</h4></li>
                <li><h4>V</h4></li>
                <li><h4>VI</h4></li>
                <li><h4>VII</h4></li>
                <li><h4>VIII</h4></li>
                <li><h4>IX</h4></li>
                <li><h4>X</h4></li>
</ul>

```

JS:

```
  $('#count li:first').addClass('cCurrent');
        $('.qAnswers li a').click(qNext);
        function qNext(){
          $('.cCurrent').next('#count li').addClass('cCurrent');
          $('.cCurrent:first').removeClass('cCurrent'); 
        }

```

Answer: 
I don't see anything wrong in your javascript, but your HTML page includes the same script twice. If the click event is registered twice, it probably causes your issue.

```
<script type="text/javascript" src='js/custom.js'></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script src='js/custom.js'></script>

```
The `js/custom.js` script is mentioned **twice** in the `<head>`. You should remove one of them, otherwise the click events are registered twice.

Furthermore, the expression inside `.next()` looks somewhat odd (you don't need the `#count` in there and maybe not even `li`) and the function itself can be simplified to this:

```
function qNext()
{
    $('#count .cCurrent')
        .removeClass('cCurrent')
        .next('li')
        .addClass('cCurrent');
}

```

It removes the class of the currently highlighted `<li>`, then moves to the next `<li>` and applies the `cCurrent` class there.

Lastly, you shouldn't give your answers a class that gives away that the answer is correct or wrong. Your answers had something like this:

```
<a href="#" class="qWrong">xxx</a>
<a href="#" class="qCorrect">xxx</a>

```

If someone would look at the source, it would be very obvious what to click.