JQuery - An alternative to chaining multiple .next () methods

Question

I have jQuery code like:

$(this).next().next().next().next().html('<span>anything</span>');

Now I want to know if there is an alternative for these functions .next()? (something like 4*next())

Note: .nextUntil() it doesn’t suit me because I don’t have a clue to use it in .nextUntil(). (My HTML structure is dynamic, in other words, it is not constant. Sometimes the final element is span, and sometimes it div, etc.)

---

Edit: Here are some examples for my HTML structure:

example1:

<button>click it</button>
<div>div1</div>
<div>div2</div>
<span>span1</span>
<a>a1</a>              <!-- target !! and it should be <span>anything</span> -->
<div>div3</div>

example2:

<button>click it</button>
<span>span1</span>
<b>b1</b>
<span>span2</span>
<div>div1</div>       <!-- target !! and it should be <span>anything</span> -->
<div>div2</div>
<div>div3</div>

Answer 1

You can combine .nextAll()/ .eq()methods:

$(this).nextAll().eq(3);

.eq() , , , .eq(3) .

:

$('div.nextAll span:first').nextAll().eq(3).addClass('selected');

$('div.multipleNext span:first').next().next().next().next().addClass('selected');

.selected {
  color: #f00;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="nextAll">
  <span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span>
</div>

<div class="multipleNext">
  <span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span>
</div>

---

, , , ~ :eq() :

$('~:eq(3)', this);

$(this).find('~:eq(3)');

:

$('~:eq(3)', 'div.nextAll span:first').addClass('selected');

$('div.multipleNext span:first').next().next().next().next().addClass('selected');

.selected {
  color: #f00;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="nextAll">
  <span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span>
</div>

<div class="multipleNext">
  <span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span>
</div>

Answer 2

, :eq(). @JoshCrozier, .eq() :eq() 0

$("~ :eq(3)", this)

$("button").click(function() {
  $("~ :eq(3)", this).html("<span>anything</span>")
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button>click it</button>
<div>div1</div>
<div>div2</div>
<span>span1</span>
<a>a1</a>              <!-- target !! and it should be <span>anything</span> -->
<div>div3</div>