[Aetae]

Dilettante_Pro, onreadystatechange вызывается несколько раз по мере обработки запроса.
DVV, что значит не помогло? Смотрим, сейчас у тебя примерно так:

<style>
#statusMessage{
  width:100px;
  height:100px;
}
.form-success:after {
   content:"form-success"
}
.form-failure:after {
   content:"form-failure"
}
.form-awaiting:after {
   content:"form-awaiting" 
}
</style>


<div id="statusMessage">result: </div>

<script>
let request = new XMLHttpRequest();
request.open("GET", location.href)
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState < 4) {
    //Добавляем картинку при ожидании отправки формы
    statusMessage.classList.add('form-awaiting');
  } else if (request.readyState === 4) {
    if (request.status == 200) {
      statusMessage.classList.add('form-success');               
    }
    else {
      statusMessage.classList.add('form-failure');
    }
  }
};
</script>

Меняешь классы местами, и внезапно работает:

<style>
#statusMessage{
  width:100px;
  height:100px;
}
.form-awaiting:after {
   content:"form-awaiting" 
}
.form-success:after {
   content:"form-success"
}
.form-failure:after {
   content:"form-failure"
}
</style>


<div id="statusMessage">result: </div>

<script>
let request = new XMLHttpRequest();
request.open("GET", location.href)
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState < 4) {
    //Добавляем картинку при ожидании отправки формы
    statusMessage.classList.add('form-awaiting');
  } else if (request.readyState === 4) {
    if (request.status == 200) {
      statusMessage.classList.add('form-success');               
    }
    else {
      statusMessage.classList.add('form-failure');
    }
  }
};
</script>

чудесно, неправда ли?

Или второй предложенный вариант:

<style>
#statusMessage{
  width:100px;
  height:100px;
}
.form-success:after {
   content:"form-success"
}
.form-failure:after {
   content:"form-failure"
}
.form-awaiting:after {
   content:"form-awaiting" 
}
</style>


<div id="statusMessage">result: </div>

<script>
let request = new XMLHttpRequest();
request.open("GET", location.href)
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState < 4) {
    //Добавляем картинку при ожидании отправки формы
    statusMessage.classList.add('form-awaiting');
  } else if (request.readyState === 4) {
    statusMessage.classList.remove('form-awaiting');
    if (request.status == 200) {
      statusMessage.classList.add('form-success');               
    }
    else {
      statusMessage.classList.add('form-failure');
    }
  }
};
</script>