Placeholder only appears for split second

Question

I'm working on a simple input form. If the user doesn't enter anything, a placeholder should appear to make the user aware that some value should be entered. But the placeholder text only appears for a split second, I think after the script is completed it reloads and the placeholder disappears. How can I make it stay until the user enters something?

window.onload = initForm;

function initForm() {
  document.getElementById("form").onsubmit = checkInput;
}

function checkInput() {
  var required = document.getElementsByClassName("req");
  var emptyForm = [];
  for (var i = 0; i < required.length; i++) {

    if (required[i].value == "") {
      emptyForm.push(required[i]);
    }
  }

  for (var i = 0; i < emptyForm.length; i++) {
    emptyForm[i].placeholder = "enter name";
  }
}

<form id="form">
  <p>Name: </p><input type="text" class="req" name="name">
  <input id="submit" type="submit" value="Submit">
</form>