skip2step.tt

<script type="text/javascript">

function skip_to_step(goto, max_steps) {

  var show_me;

  for(var i = 1; i <= max_steps; i++) {
    if(ele = document.getElementById('step' + i)) {
      ele.style.display = 'none';
      if(i == goto) {
        show_me = ele;
      }
    }
  }
 
  if(show_me) {
    show_me.style.display = 'block';
  }
}
</script>

<style type="text/css">
.example div {
   display: none;
}
#step1 {
   display: block;
}
</style>

<h2>Click on the button to go to the next step</h2>
<div class="example">
<div id="step1">
<pre>
1 1 1 1 1 1 1 1 1 1 1 1 1
</pre>
<input type="button" onclick="skip_to_step(2, 4)" value="Goto step 2">
</div>

<div id="step2">
<pre>
2 2 2 2 2 2 2 2 2 2 2 2 2
2 2 2 2 2 2 2 2 2 2 2 2 2
</pre>
<input type="button" onclick="skip_to_step(3, 4)" value="Goto step 3">
</div>

<div id="step3">
<pre>
3 3 3 3 3 3 3 3 3 3 3 3 3
3 3 3 3 3 3 3 3 3 3 3 3 3
3 3 3 3 3 3 3 3 3 3 3 3 3
</pre>
<input type="button" onclick="skip_to_step(4, 4)" value="Goto step 4">
</div>

<div id="step4">
<pre>
4 4 4 4 4 4 4 4 4 4 4 4 4
4 4 4 4 4 4 4 4 4 4 4 4 4
4 4 4 4 4 4 4 4 4 4 4 4 4
4 4 4 4 4 4 4 4 4 4 4 4 4
</pre>
<input type="button" onclick="skip_to_step(1, 4)" value="Goto step 1">
</div>

</div>