How do I make my css animations work.I don't understand why it is not working

Question

body {
background-color:black;
}
div{
width:100px;
height:100px;
background-color:yellow;
animation-name:colorchange;
animation-duration:10s;
}
@keyframes colorchange{
0%{background-color:yellow;}
25%{background-color:red;}
50%{background-color:blue;}
75%{background-color:green;}
100%{background-color:yellow;}
}

Answer 1

You have to add :

animation-iteration-count:infinite;

Instead of infinite , you can add any number(the number of how many times you want the animation to start).
This is why your css animation doesn't work.
Try it , and tell me if it work. 😊

Answer 2

Your code does work. Check out my jsfiddle.net link.

https://jsfiddle.net/ialbertm/80yujxmk/5/