중첩반복문 질문드립니다.

탭기능 구현하면서 중첩반복문 사용해서 코드 간소화 해보았습니다.
근데 중첩반복문 작동방식이 이해가 가지 않습니다.
일단 브라우저에서 작동하는 순서는
1. 탭 버튼중 하나를 누른다. (예를들어 0번탭)
2. 0번탭을 누르면서 이벤트리스너 'click' 작동
3. 이벤트리스너 안의 forEach 반복문이 버튼의 개수만큼 실행되며 3개 버튼 모두 orange 클래스가 사라짐
4. 0번탭에 orange 클래스가 추가됨

근데 여기서 for문의 역할이 이해가 가지 않습니다.
console.log(i)로 탭을 클릭할때 i가 무엇이 출력되는지 확인해보니 0번탭 누르면 0, 1번탭 누르면 1, 2번탭 누르면 2가 출력됩니다.
하지만 for문 for (let i = 0; i < 버튼.length; i++) { 는 i가 0~2가 될때까지 반복해준다는 코드인데 왜 0번탭을 눌렀을때 for문이 멈추고 아래 코드들이 작동하고 끝나는지 궁금합니다.
여기서 for문의 역할은 무엇인가요?