XML menu with limited height and multiple pages

I am creating a menu from XML which has a limited height area.

When the maximum height has been reached and arrow appears to take the user to the next page. There may be lots of pages.

An object array (menu.names) holds references to the menu buttons. I need to be able to split the array by pages to enable the page turning and don't really know what to do next.

Any suggestions or ideas about the next steps I should take are greatly appreciated.

Here's the code:
var totalHeight = 162.2;
var spacer = 2;
var menuNumber = 0;

myxml = new XML();
myxml.ignoreWhite = true;
myxml.load("xml/newsletters.xml");
myxml.onLoad = myOnLoad;

function myOnLoad () {
rootNode = myxml.firstChild;

var menu = new Object();

menu.title = new Array();
menu.names = new Array();
menu.links = new Array();
menu.buttons = new Array();

for (var n = 0; n<rootNode.childNodes.length; n++) {
if(rootNode.childNodes[n].nodeName == "item") {
menu.names.push(rootNode.childNodes[n].firstChild.firstChild.nodeValue);
menu.links.push(rootNode.childNodes[n].firstChild.nextSibling.firstChild.nodeValue);
} else {
menu.title.push(rootNode.childNodes[n].firstChild.nodeValue);
}
}

counter01 = (menu.names.length);

for (i=0; i< counter01; i++) {
trace("menuNumber = " + menuNumber);

menu.buttons[i] = currentItem;
currentItem = menuItem.duplicateMovieClip("menuItem" + i, i);
currentItem.menuText.autoSize = "left";
currentItem.menuText.text = menu.names[i];
currentItem._x = 9.5;
currentItem._y = totalHeight;
myHeight = currentItem.menuText._height
totalHeight = totalHeight + myHeight + spacer;
trace("totalHeight = " + totalHeight);
if(totalHeight >= 500) {
totalHeight = 162.2;
menuNumber ++;
}

}
}