How, when parsing a page using Jquery methods, to display information of a specific Tag with a specific dynamic sequence number?

Question

JavaScript

Hello, I ran into a problem, there is a page that displays information about the user, but in different tags <span>, with different classes. The information that I get is in tags <span class="user__to">, but when parsing, it turns out to display the first tag with this class. I tried to output through variables, but unfortunately this code turns out to be cumbersome, and the problem is that their sequence is not static, and they can sometimes change their sequence, not all of course, but most of them.

$.get('/user-kabinet.html', function (user) { 
  var contents = $('.user__to', user)[1];
  $('#name').html($('.user__to, user).html());
  $('#rank').html($(contents).html());
});

What do I mean by sequence, for example I have <span>Имя</span> <span>Фамилия</span>and between them after editing the profile appears

<span>Имя</span><span>Почта</span> <span>Фамилия</span>

, it turns out that the sequence has changed and is now <span>Фамилия</span>at number 3, and therefore the information changes during the output. How to achieve information output with automatic change of sequence number? On jquery, I will be very grateful for the help!

Answer 1

And so, I solved the problem in a cumbersome, possibly crutch way. Below will be the code:

$.get('/user-kabinet.html', function (user) { 
  $('#ne').html($('.us__tag:eq(0)', user).html());
  $('#rk').html($('.us__tag:eq(1)', user).html());
  $('#de').html($('.us__tag:eq(-1)', user).html());

I'll explain what I did. First, I pulled out static objects that do not change their index, namely: first, second and last <span class="us__tag">, so I got those zones that can have dynamic indexes, for example, it was 4, it became 5 after the user added other information.
What did I do with these tags? I looked for them by name, since there are additional tags <span class="us__title"></span>, by which, using the if conditions, I found out whether an object with the given name is present or not, if the value was negative, then I displayed an error message, if it was positive, then I also used it, etc. $('#de').html($('.us__tag:eq(-2)', user).html());