Edit in JSFiddle

div = document.createElement('div');
document.body.appendChild(div);
div.className = 'fade';
div {
    background-color: black;
    display: block;
    height:100px;
    width:100px;
    opacity: 0;
 }
 div.fade {
    -webkit-animation: fade 5s;
    animation: fade 5s;
    opacity: 1;
 }
/* -fail- */
@-webkit-keyframes fade {
    from {opacity: 0}
    to {opacity: 1}
}@keyframes fade {
    from {opacity: 0}
    to {opacity: 1}
}