Вложенный цикл for возвращает неверный результат

Всем привет! Друзья, подскажите пожалуйста, ато я запутался: имеются три абзаца с текстом и кнопка. По нажатию на кнопку, нужно записать в начало текста каждого абзаца его нумерацию.

   <p class = 'someText'>Some text</p>
   <p class = 'someText'>Some text</p>
   <p class = 'someText'>Some text</p>
   <input id = 'buttonText' type = 'submit'>

А вот и сам код:

let numList = document.querySelectorAll('.someText');
let outputList = document.querySelector('#buttonText');
outputList.addEventListener('click', function() {
   for (elem of numList) {
      for (var i = 0; i < numList.length; i++) {
      var n = i + 1;
      numList[i].innerHTML = n + numList[i].innerHTML;
      }
    }
  });

В итоге он мне выдает:

111Some text 222Some text 333Some text

Он делает больше итераций, чем нужно. Очень нужно понять этот момент. Помогите объяснить. Возможно имеется более лаконичный вариант. Заранее спасибо!


Ответы (1 шт):

Автор решения: Алексей Шиманский

let numList = document.querySelectorAll('.someText');
let outputList = document.querySelector('#buttonText');
outputList.addEventListener('click', function() {
   //for (elem of numList) {
      for (var i = 0; i < numList.length; i++) {
      var n = i + 1;
      numList[i].innerHTML = n + numList[i].innerHTML;
      }
  //  }
  });
 <p class = 'someText'>Some text</p>
   <p class = 'someText'>Some text</p>
   <p class = 'someText'>Some text</p>
   <input id = 'buttonText' type = 'submit'>

→ Ссылка