rvsbox,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.my{
font-size: 4em;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
var arr01 = ["a1", "a2", "a3", "a4"],
arr02 = ["b1", "b2", "b3", "b4"],
arr03 = ["c1", "c2", "c3", "c4"],
globalArray = [arr01, arr02, arr03],
len = globalArray.length,
i = 0,
timer;
function fn(n, k) {
$("#info").text(n.slice(0, k));
if (k++ < n.length) timer = window.setTimeout(function() {
fn(n, k)
}, 200)
}
$("#next").click(function() {
window.clearTimeout(timer);
fn(globalArray[i].slice(0), 1);
i = ++i % len
})
});
</script>
</head>
<body>
<button id="next">next</button>
<div id="info"></div>
</body>
</html>