Я хочу переместить все элементы div с классом "goccia" вместе сверху вниз, используя функцию setInterval ().
Я не могу понять, почему он перемещает только первый элемент (.goccia)
Вот мой код JavaScript.
var campo = document.querySelector('#campo');
var marginTop = 0;
function creaGocce(){
var numeroGocce = document.querySelector('input').value;
for (var i = 0; i < numeroGocce; i++) {
campo.innerHTML += ' <div class = "divGoccia"> <div class = "goccia">
</div> </div>';
}
}
function scompari(){
document.querySelector('.contenitore').style.display = 'none';
}
function spostaGocce(){
var goccia = document.querySelector('.goccia');
goccia.style.marginTop = marginTop + "px";
marginTop += 10;
}
function muoviti(){
scompari();
creaGocce();
setInterval(spostaGocce, 1000);
}
document.querySelector('button').addEventListener('click', muoviti);