Im trying to check / alter the value of a <span> tag, but with no luck. Here is the code Im using:

<p>
        <label for="userName" class="labelDef">Username <span class="highlight">*</span></label>
        <input type="text" name="userName" id="userName" />
        <span id="userNameValidate" class="highlight">invalid</span>
        <label>
        <input type="submit" name="button" id="button" value="Submit" onclick="validateUserName()" />
        </label>
      </p>

// JavaScript Document

function validateUserName()
    {
        var userName = document.form1.userName.value;
        var userNameValidate = document.form1.userNameValidate;
               
        alert(userNameValidate.value);
           
    }

But Firefox gives the error

userNameValidate has no properties

Does anyone know what Im doing wrong??

var userNameValidate = document.getElementById('userNameValidate').innerH TML

Thanks but that doesnt seem to quite work. An alert box pops up but it just says 'undefined', rather than the text contained in the <span>

Do you know how I could do that?

Take a look at these:
getElementById()
http://developer.mozilla.org/en/docs...getElementById
the returned Element object:
http://developer.mozilla.org/en/docs/DOM:element

Originally Posted by KkillgasmM

Thanks but that doesnt seem to quite work. An alert box pops up but it just says 'undefined', rather than the text contained in the <span>

Do you know how I could do that?

It should be innerHTML

(the forum adds random spaces to js code in posts. use the [code] delimiters to stop it happening)

eg:

var userNameValidate = document.getElementById('userNameValidate').innerHTML