jQuery skip div within a sequence

Question

I have the following:

CSS

.sequence-container div {display:none;}    

jQuery

$('.sequence-container div:first').show();

$('.next').click(function() {
  var $next = $('.sequence-container div:visible').next();
  var $page = $('.sequence-container div:visible').attr("id");
}

I have a series of `divs'

<div class='sequence-container'></div>
<div class='sequence-container'></div>
<div class='sequence-container'></div>

The code works well, all DIVS are hidden, on page load, the first div is shown and then when a user clicks a button, the jQuery is fired to show the next div and so on.

However, what I am struggling with is how to skip a div:

$next = $('.sequence-container div:visible').next();

I sometimes need it to be the div after the next div if that makes sense. Is that possible and any suggestions on where to start?

Answer 1

Just do

$next = $next.next();

.