if statement not recognizing value even though console.log confirms it

I am trying to make a contact list in HTML. When adding a new contact, a menu comes up in which the user can enter information about the contact. For some reason, when I try to console.log the values of any of the fields (as I need to use the firstnamefield field to determine whether or not the contact is valid), it says that it can not find the value of null. As a result, my if statements aren't working and I am unable to keep the user from making a totally blank contact.

Code below, any help appreciated.

function addContact() { //called by the "add contact button", inserts the fields for the custom
      document.getElementById("description").innerHTML="<h2><input type='text' id='firstnamefield' placeholder='First Name' value=''></h2><h2><input type='text' id='middlenamefield' placeholder='Middle Name'></h2><h2><input type='text' id='lastnamefield' placeholder='Last Name'></h2><input type='text' id='nicknamefield' placeholder='Nickname'><br><br><input type='text' id='phonefield' placeholder='Phone'><br><input type='text' id='emailfield' placeholder='Email'><br><br><input type='text' id='birthdayfield' placeholder='Birthday'><br><button type='button' id='finishbutton' onclick='finalizeContact()'>Finished</button>";
}

function finalizeContact() { //called by the "finished" button on the contact information form that appears when adding a contact, turns the information that has just been input by the user into a contact under the custom section at the bottom of the list
  var firstname=document.getElementById('firstnamefield').value;
  console.log(firstname);
  if(document.getElementById("firstnamefield").value != null || firstname != '') {
    document.getElementById('custom').innerHTML = document.getElementById('custom').innerHTML + "<button type='button' class='customcontact' onclick=\"display('" + document.getElementById('firstnamefield').value + "', '" + document.getElementById('nicknamefield').value + "', '" + document.getElementById('lastnamefield').value + "', '" + document.getElementById('nicknamefield').value + "', '" + document.getElementById('phonefield').value + "', '" + document.getElementById('emailfield').value + "', '" + document.getElementById('birthdayfield').value + "')\">" + document.getElementById('firstnamefield').value + " " + document.getElementById('lastnamefield').value + "</button>";
    display(document.getElementById('firstnamefield').value, document.getElementById('middlenamefield').value, document.getElementById('lastnamefield').value, document.getElementById('nicknamefield').value, document.getElementById('phonefield').value, document.getElementById('emailfield').value, document.getElementById('birthdayfield').value)
    if(document.getElementById('custom').style.display=="none") { // if there hasn't been a custom contact created yet, the CUSTOM section isn't visible. therefore, if the CUSTOM section is hidden, this function will make it visible
      document.getElementById('custom').style.display="block";
    }
  } else {
    document.getElementById("firstnamefield").style.border = "5px solid red";
    document.getElementById("description").innerHTML = "Please enter a name.<br>" + document.getElementById("description").innerHTML;
  }
}