jQuery - Alternative to chaining multiple .next() methods

Question

I have a jQuery code like this:

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

Now I want to know is there any alternative for those .next() functions? (something like 4*next())

Note: .nextUntil() is not useful for me, Because I don't have any clue to use it in .nextUntil(). (My HTML structure is dynamic. In other word, it is not constant. Sometimes the final element is a span, and sometimes it is a div and so on ...)

---

Edit: Here is a few 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 could combine the .nextAll()/.eq() methods:

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

As a side note, the .eq() method accepts an index that is zero-based, which means that .eq(3) will select the fourth element.

Example:

$('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>

---

Alternatively, as pointed out in the comments, you could also use a combination of the general sibling combinator, ~ and the :eq() selector:

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

or:

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

Example:

$('~: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>