Form Validation - Broken

Form Validation - Broken

HTML

<div id="theForm">
    <div>
        <label for="firstName">First Name:</label>
        <br>
        <input type="text" id="firstName" name="first" value="" />
    </div>
        
    <div> 
        <label for="lastName">Last Name:</label>
        <br>
        <input type="text" id="lastName" name="last" value="" />
    </div>
        
    <div>
        <label for="email">Email:</label>
        <br> 
        <input type="email" id="email" name="email" value="" />
    </div>
       
    
    <button type="button" id="submitButton">Submit</button>
</div>

JavaScript

function validate () {  
    var theForm = document.getElementById('theForm'),
        firstName = document.getElementById('firstName'),
        lastName = document.getElementById('lastName'),
        email = document.getElementById('email'),
        confirmEmail = document.getElementById('confirmEmail'),
        label = theForm.getElementsByTagName('label'),
        input = theForm.getElementsByTagName('input'),
        inputLength = input.length;

    // Remove any spans that may have been added by the next for loop
    for (var x = 0; x < inputLength; x++) {
         var currLbl = label[x];  
        if ( currLbl.parentNode.getElementsByTagName('span').length > 0 ) {
            var span = currLbl.parentNode.getElementsByTagName('span')[0];          
            removeElement(span);
        }
    }
    
    // Error checking for the form.
    // Add error message next to any element that has a blank value.
    for (var i = 0; i < inputLength; i++) {
        // innerText for IE, textContent for other browsers
        var labelText = label[i].innerText || label[i].textContent;
        var currLabel = label[i];
        var text = document.createTextNode( labelText + ' cannot be empty');
        
        if ( input[i].value === '' ) {
            currLabel.parentNode.style.color = 'red';
            currLabel.insertAdjacentHTML('afterend', ' <span>cannot be empty</span>');

        }
        else if ( input[i].value !== '') {
            currLabel.parentNode.style.color = '';
        }
    }
 

    // Test to make sure all inputs have a value,
    // and that confirmEmail equals email.    
    alert(firstName.value);
    if (firstName.value !== '' && lastName.value !== '' && email.value !== '' && confirmEmail.value !== '' && email.value === confirmEmail.value) {
        alert("Submitted!!!");
        return true;
    } else {
        return false;
    }

};

// Remove Element function
function removeElement(node) {
   ...