Not sure if this is what you want. This is the idea of your code snippet but rewritten to work with any amount of <span> tags...

Code: 
<script type="text/javascript">
function showhide() {
    // Coded by CyberJ37 <= LIES!
    // Hyperz was here (:
    var show_hide = document.getElementsByName("show_hide");
    var changed = false;
    var i;
    
    if (show_hide[show_hide.length-1].style.display == "block")
    {
        show_hide[show_hide.length-1].style.display = "none";
        show_hide[0].style.display = "block";
        return;
    }
    
    for (i = 0; i < show_hide.length; i++)
    {
        if (changed)
        {
            show_hide[i].style.display = "none";
        }
        else if (show_hide[i].style.display == "block")
        {
            show_hide[i].style.display = "none";
            show_hide[i+1].style.display = "block";
            changed = true;
            i++;
        }
        else
        {
            // Houston, we've got a problem...
        }
    }
}
</script>

<span style="display: block" name="show_hide">1</span>
<span style="display: none" name="show_hide">2</span>
<span style="display: none" name="show_hide">3</span>
<span style="display: none" name="show_hide">4</span>
<span style="display: none" name="show_hide">5</span>
<span style="display: none" name="show_hide">6</span>
<span style="display: none" name="show_hide">7</span>
<span style="display: none" name="show_hide">8</span>
<span style="display: none" name="show_hide">9</span>
<span style="display: none" name="show_hide">10</span>
<br /><br />
<a href="#" onclick="showhide(); return false;">Clicky</a>