Как сделать так, чтобы при нажатии на кнопку начиналась анимация и при каждом нажатии передавался на другой блок?

Question

[Marco142]

При нажатии на кнопку первый элемент приподнимается если можно так выразиться. Я хочу, чтобы при каждом нажатии анимация действовала и на другие элементы поочередно.

Песочница к вашим услугам

Answer 1

[Lynatik001]

Ничего сложного. В яваскрипте делать document.querySelectorAll('.inpClass')
- находит всё нужные кнопки и потом же опять в яваскрипте при каждом клике проходишся по стилям конкретной кнопки и делаешь css вставки в него(типа подымись по ввыше). - при этом используй transition для плавной анимации, вот и всё

$(document).ready(function () {
  let curr = 1;
    $('#btn').on('click', function () {
        $(`.dot:nth-child(${curr})`).toggleClass('open');
      curr++
    });
});

вот самое унылая и требуящая доработки реализация с вашей песочницы. Тем не менее рабочая.

Answer 2

[William Thorn]

$('.dot') - список всех элементов с классом 'dot'
Используйте each для перебора и изменения списка элементов.