I have array of data returning by Ajax and I want to show them one by one in panel, currently they are all in one panel at the same time, I wish to have multiple step of this data.

Code

HTML

Script

$.ajax({
    type:'GET',
    url:'{{url('dashboard/getQuizzes')}}/'+projectId,
    beforeSend: function(data) {
        console.log("click - ajax before send", data);
    },
    success:function(data){
        $(data.quizzes).each(function(_, i){
            $('.answerPanel').append(i.question);
        });
    }
});

this $('.answerPanel').append(i.question); is returning all data together in my view, I also tried this answer the only difference was it had brake line with it :)

Result

Question

My question is how can I make multi step panel with this data?

What I'm looking for is having how are you?fg (based on my screenshot) in first page then I click next button and get uid and so on...