질문있습니다!

예제 처럼 .characters 에 setAttribute로 data-id 를 적용시켰듯이 만약 탭을 위한 버튼을 만든다고 가정 했을때

<div class="ilbuniBtn">

        <ul class="ilbuniBox">

            <li class="ilbuni a">

                <p>일분이01</p>

            </li>

            <li class="ilbuni b">

                <p>일분이02</p>

            </li>

            <li class="ilbuni c">

                <p>일분이03</p>

            </li>

            <li class="ilbuni d">

                <p>일분이04</p>

            </li>

        </ul>

    </div>

각각의 li의 클래스인 .ilbuni에 data-tab 이라는 명칭과 그 안에 데이터의 값을 증가시켜 넣고 싶은데 그럴 때는 어떻게 하면 되나요?!!

제가 생각했던 방법은 for문으로 돌려 클래스에 개수를 가져오고 그 가져온 개수에 데이터아이디와 값을 증가 시켜 넣으면 되지 않을까 생각했습니다.

const ilbutab = document.querySelectorAll('.ilbuni ');

for( i=0; i < ilbutabl.length; i++ ){

ilbutab.setAttribute("data-tab",  btn[i]);

또는 

ilbutab.setAttribute("data-tab",  i);

}

했더니 에러가 떠서 궁금해서 질문드립니다..!!