else if (document.getElementById(''ButtonNext'').name == ''Step3'')
            {
                document.getElementById(''ButtonNext'').name = ''Step4'';
                document.getElementById(''ButtonPrevious'').name = ''Step2'';
                document.getElementById(''Step2'').style.display = ''none'';
                document.getElementById(''Step3'').style.display = '''';
                document.getElementById(''HeaderTableStep3'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep2'').style.backgroundColor = ''Silver'';
            }
            else if (document.getElementById(''ButtonNext'').name == ''Step4'')
            {
                document.getElementById(''ButtonNext'').name = ''Step5'';
                document.getElementById(''ButtonPrevious'').name = ''Step3'';
                document.getElementById(''Step3'').style.display = ''none'';
                document.getElementById(''Step4'').style.display = '''';
                document.getElementById(''HeaderTableStep4'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep3'').style.backgroundColor = ''Silver'';
            }
            else if (document.getElementById(''ButtonNext'').name == ''Step5'')
            {
                document.getElementById(''ButtonNext'').name = '''';
                document.getElementById(''ButtonPrevious'').name = ''Step4'';
                document.getElementById(''ButtonNext'').disabled = ''disabled'';
                document.getElementById(''SubmitFinal'').disabled = '''';
                document.getElementById(''Step4'').style.display = ''none'';
                document.getElementById(''Step5'').style.display = '''';
                document.getElementById(''HeaderTableStep5'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep4'').style.backgroundColor = ''Silver'';
                loadStep5Review();
            }
        }

        function handleWizardPrevious()
        {
            if (document.getElementById(''ButtonPrevious'').name == ''Step1'')
            {
                document.getElementById(''ButtonNext'').name = ''Step2'';
                document.getElementById(''ButtonPrevious'').name = '''';
                document.getElementById(''ButtonPrevious'').disabled = ''disabled'';
                document.getElementById(''Step2'').style.display = ''none'';
                document.getElementById(''Step1'').style.display = '''';
                document.getElementById(''HeaderTableStep1'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep2'').style.backgroundColor = ''Silver'';
            }
            else if (document.getElementById(''ButtonPrevious'').name == ''Step2'')
            {
                document.getElementById(''ButtonNext'').name = ''Step3'';
                document.getElementById(''ButtonPrevious'').name = ''Step1'';
                document.getElementById(''Step3'').style.display = ''none'';
                document.getElementById(''Step2'').style.display = '''';
                document.getElementById(''HeaderTableStep2'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep3'').style.backgroundColor = ''Silver'';
            }
            else if (document.getElementById(''ButtonPrevious'').name == ''Step3'')
            {
                document.getElementById(''ButtonNext'').name = ''Step4'';
                document.getElementById(''ButtonPrevious'').name = ''Step2'';
                document.getElementById(''Step4'').style.display = ''none'';
                document.getElementById(''Step3'').style.display = '''';
                document.getElementById(''HeaderTableStep3'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep4'').style.backgroundColor = ''Silver'';
            }
            else if (document.getElementById(''ButtonPrevious'').name == ''Step4'')
            {
                document.getElementById(''ButtonNext'').name = ''Step5'';
                document.getElementById(''ButtonPrevious'').name = ''Step3'';
                document.getElementById(''ButtonNext'').disabled = '''';
                document.getElementById(''SubmitFinal'').disabled = ''disabled'';
                document.getElementById(''Step5'').style.display = ''none'';
                document.getElementById(''Step4'').style.display = '''';
                document.getElementById(''HeaderTableStep4'').style.backgroundColor = ''Yellow'';
                document.getElementById(''HeaderTableStep5'').style.backgroundColor = ''Silver'';
            }

        }

        function loadStep5Review()
        {
            document.getElementById(''ReviewFirstName'').innerHTML = document.getElementById(''TextFirstName'').value;
            document.getElementById(''ReviewMiddleName'').innerHTML = document.getElementById(''TextMiddleName'').value;
            document.getElementById(''ReviewLastName'').innerHTML = document.getElementById(''TextLastName'').value;
            document.getElementById(''ReviewEmail'').innerHTML = document.getElementById(''TextEmail'').value;
            if (document.getElementById(''CheckboxHtmlGoodies'').checked == 1)
            {
                document.getElementById(''ReviewHtmlGoodies'').innerHTML = ''Yes'';
            }
            else
            {
                document.getElementById(''ReviewHtmlGoodies'').innerHTML = ''No'';
            }

            if (document.getElementById(''CheckboxJavaScript'').checked == 1)
            {
                document.getElementById(''ReviewJavaScript'').innerHTML = ''Yes'';
            }
            else
            {
                document.getElementById(''ReviewJavaScript'').innerHTML = ''No'';
            }

            if (document.getElementById(''CheckboxWdvl'').checked == 1)
            {
                document.getElementById(''ReviewWdvl'').innerHTML = ''Yes'';
            }
            else
            {
                document.getElementById(''ReviewWdvl'').innerHTML = ''No'';
            }

            var iCounter = 1;
            var iCharacterCount = document.getElementById(''TextPassword'').value.length;
            var passwordMasked = '''';
            for (iCounter = 1; iCounter <= iCharacterCount; iCounter++)
            {
                passwordMasked = passwordMasked + ''*'';
            }
            document.getElementById(''ReviewPassword'').innerHTML = passwordMasked;
        }
    </script>
</head>

<body>
<form id="SubscriptionWizard" action="" method="post">
    <table border="1" cellpadding="5" cellspacing="0" id="HeaderTable">
        <tr>
            <td id="HeaderTableStep1" style="background-color:Yellow">
                Step 1: Getting Started</td>
            <td id="HeaderTableStep2" style="background-color:Silver">
                Step 2: Name</td>
            <td id="HeaderTableStep3" style="background-color:Silver">
                Step 3:&nbsp; Account Access</td>
            <td id="HeaderTableStep4" style="background-color:Silver">
                Step 4: Select subscriptions</td>
            <td id="HeaderTableStep5" style="background-color:Silver">
                Step:5 Finalize &amp; Submit</td>
        </tr>
    </table>
    <br />
<span id="Step1"><strong>
    Welcome to our Subscription Wizard!<br />
    </strong>
        <br />
    This wizard simulates subscribing for access to website content. Each step is highlighted in the header.
    <br />

    This step is intended to provide the user with everything they need to know to get started.

    <br />
</span>
<span id="Step2" style="display:none">
    <table border="0" cellpadding="5" cellspacing="0">
        <tr>
            <td align="right">
                First name:</td>
            <td>
                <input id="TextFirstName" name="FirstName" type="text" /></td>
        </tr>
        <tr>
            <td align="right">
                Middle name:</td>
            <td>
                <input id="TextMiddleName" name="MiddleName" type="text" /></td>
        </tr>
        <tr>
            <td align="right">
                Last name:</td>
            <td>
                <input id="TextLastName" name="LastName" type="text" /></td>
        </tr>
    </table>
</span>

<span id="Step3" style="display:none">
    <table border="0" cellpadding="5" cellspacing="0">
        <tr>
            <td align="right">
                Email:</td>
            <td>
                <input id="TextEmail" name="Email" type="text" /></td>
        </tr>
        <tr>
            <td align="right">
                Password:</td>
            <td>
                <input id="TextPassword" name="Password" type="password" /></td>
        </tr>
    </table>
</span>

<span id="Step4" style="display:none">
    <table border="0" cellpadding="5" cellspacing="0">
        <tr>
            <td align="left" colspan="2">
                <strong>
                Select your subscription:</strong></td>
        </tr>
        <tr>
            <td align="right">
                www.ahqibing.net:</td>
            <td>
                <input id="CheckboxHtmlGoodies" name="CheckboxHtmlGoodies" type="checkbox" value=http://www.chinaz.com/Design/Pages/"Yes" /></td>
        </tr>
    </table>
</span>

<span id="Step5" style="display:none">
    <table border="0" cellpadding="5" cellspacing="0">
        <tr>
            <td colspan="2">
                <strong>Final Review:</strong></td>
        </tr>
        <tr>
            <td align="right">
                First name:</td>
            <td id="ReviewFirstName">
                </td>
        </tr>
        <tr>
            <td align="right">
                Middle name:</td>
            <td id="ReviewMiddleName">
                </td>
        </tr>
        <tr>
            <td align="right">
                Last name:</td>
            <td id="ReviewLastName">
                </td>
        </tr>
        <tr>
            <td align="right">
                Email:</td>
            <td id="ReviewEmail">
            </td>
        </tr>
        <tr>
            <td align="right">
                Password:</td>
            <td id="ReviewPassword">
            </td>
        </tr>
        <tr>
            <td align="left">
                <strong>
                Subscribed to:</strong></td>
            <td>
            </td>
        </tr>
        <tr>
            <td align="right">
                www.ahqibing.net:</td>
            <td id="ReviewHtmlGoodies">
            </td>
        </tr>
    </table>
</span>
<br />  
<table border="0" cellpadding="5" cellspacing="0">
    <tr>
        <td>
            <input id="ButtonPrevious" type="button" value=http://www.chinaz.com/Design/Pages/"Previous" disabled="disabled" name=""

onclick="handleWizardPrevious()" /></td>
        <td>
            <input id="ButtonNext" type="button" value=http://www.chinaz.com/Design/Pages/"Next" name="Step2" onclick="handleWizardNext()" /></td>
        <td>
            <input id="SubmitFinal" type="submit" value=http://www.chinaz.com/Design/Pages/"Finish" disabled="disabled" /></td>
    </tr>
</table>
</form>
</body>
</html>