자바스크립트 질문이요

화면 전환하는걸 시도해볼려고 합니다. 출력 누르면 외부js파일에서 계산되서 id = x에는 0~30값 넣어놓고, id = y는 30 ~ 60 넣고, id = z 는 60 ~90을 넣어놓게 되고, 그러면 젤 처음에 출력 누르면 id = x먼저 출력되고 버튼 누르는거에 따라 div id 값이 계속 바뀌게 하면서 화면 바뀌는것 처럼 싶은데 어떻게 해야할까요?

//외부js파일

function btn() {

 var arr = [];

    for (var a = 0; a < 100; a++) {

        arr[a+1] = a;

for(var b =0; b<30; b++){

var str1 = arr[b+1]+"<br>";

document.getElementById("x").innerHTML = str1;

}

for(var c =30; c<60; c++){

var str2 = arr[c+1]+"<br>"; 

document.getElementById("y").innerHTML = str2;

}

for(var d =60; d<90; d++){

var str3 = arr[d+1]+"<br>"; 

document.getElementById("z").innerHTML = str3;

}

}

//main.html

<div id = 'x'></div>

<button onclick ="btn()">출력</button>

<button onclick ="first()">f</button>

<button onclick ="second()">s</button>

<button onclick ="third()">t</button>

        <script> //

            var content = document.getElementById("x");

            function first() {

                content.setAttribute("id", "x");

            }

            function second() {

                content.setAttribute("id", "y");

            }

            function third() {

                content.setAttribute("id", "z");

            }

        </script>