Button (disabled = false) conditions; works in some cases and not in others

Question

I have a problem with a code that works when I only use conditions for years, but when I add conditions for type, name and place the function does not produce the expected result (change the button status to disabled = false).

I use a document event listener to check for user actions:

document.addEventListener("blur", enableSaveButton());

I have the following code to check for conditions on when to set a button's disabled value to false:

function enableSaveButton() {
startyear = document.getElementById('start_year');
endyear = document.getElementById('end_year');
type = document.getElementById('type');
place = document.getElementById('place');
name = document.getElementById('name');
if (!(startyear.className === "form-group has-success")) { return; }; // works
if (!(endyear.className === "form-group has-success")) { return; }; // works
if (!(type.className === "form-group has-success")) { return; };// does not work
if (!(place.className === "form-group has-success")) { return; };// does not work
if (!(name.className === "form-group has-success")) { return; }; // does not work
document.getElementById("savebutton").disabled = false; } // this code works 

startyear and endyear both use the same function, validateYear(year, id) (when field onblur) for setting form group status to either "form-group has-success" or "form-group has-error".

type, name and place use another function, faultyChars(stringen, id) for producing the same result.

The both work according to purpose (even though the code may not be state-of-the-art...) =)

If I only use startyear and endyear in the enableSaveButton() function it works perfectly. But if I add the type, place and name the error kicks in, even though it contains virtually the same code. Any ideas on this? All and any help is appreciated!

Here are the functions I mentioned:

function validateYear(year, id){
console.log("Inne i validateYear");
var x = document.getElementById(id);
if (year === "") {  x.className="form-group has-error"; return false; }
if (isNaN(year)) {  x.className="form-group has-error"; return false; }
if (year.length !== 4) {  x.className="form-group has-error"; return false; }
if ((year.substr(0,2) !== "19") && (year.substr(0,2) !== "20")) { x.className="form-group has-error"; return false; }
else { 
    x.className="form-group has-success";
    enableSaveButton(year);
    return true; }

}

function enableSaveButton() {
startyear = document.getElementById('start_year');
endyear = document.getElementById('end_year');
type = document.getElementById('type');
place = document.getElementById('place');
name = document.getElementById('name');
if (!(startyear.className === "form-group has-success")) { return; };works
if (!(endyear.className === "form-group has-success")) { return; }; // works
if (!(type.className === "form-group has-success")) { return; };// does not work
if (!(place.className === "form-group has-success")) { return; };// does not work
if (!(name.className === "form-group has-success")) { return; }; // does not work
document.getElementById("savebutton").disabled = false; // this code works

}

Answer 1

I found part of the answer. The problem was that you have to go back to one of the year fields and leave it. Then, when the onblur kicks in, the button becomes active.

So the code is functioning allright, the problem is that is it not working as I would expect it to. I have a whole lot of console-logging to do, but the original question is no longer.