Эффекты на div при создании через js

document.querySelector('button').onclick = function(){ 
  let el = document.createElement('div'); 
  el.classList.add('element'); 
  document.body.appendChild(el); 
 
}

.element{ 
  width: 50px; 
  height: 20px; 
  background-color: red; 
  animation: expand 1s; 
} 
 
@keyframes expand { 
  from { 
    background: blue; 
  } 
}

<button>add</button>