Какую функцию можно использовать для перелистывания?

[Nice]

У меня стоит задача сделать квиз (опросник). Сам опросник свёрстан, но сейчас все вопросы выводятся в div блоке #quiz в столбик друг под другом. Мне же необходимо, чтобы вопросы пролистывались по одному по нажатию на кнопку "Далее". Каждый вопрос завёрстан в отдельной <form></form> с уникальным id

По сути мне надо на каждый текущий вопрос применять свойства

$('#quiz form').addClass('active');
$('#quiz form').fadeIn();

А ко всем остальным

$('#quiz form').removeClass('active');
$('#quiz form').fadeOut();

Но какую функцию я могу использовать для того, чтобы отличить текущий объект (form) от нетекущего, чтобы применить эти действия? Необходимо использовать for, forEach или что-то другое?

[рони]

чтобы вопросы пролистывались по одному по нажатию на кнопку "Далее".

https://javascript.ru/forum/misc/762...tml#post500647

[Nice]

https://javascript.ru/forum/misc/762...tml#post500647

по-моему, это немного другое. У меня не тесты, просто сбор информации и отправка на почту. В примере инфо как я поняла подгружается из массива js, а у меня уже свёрстаны элементы в html. Хотелось бы просто задать условие, чтобы была возможность повесить класс active на активный элемент

[Nice]

Скрипя мозгами обеспечила перелистывание таким вод кодом

jQuery('#quiz').ready(function($) { 
	$('#quiz form').removeClass('active');
	$('#quiz form').fadeOut();	
	$('#quiz form#step-1').addClass('active');
	$('#quiz form#step-1').fadeIn();	
	var counter = -1;
	$('#quiz input[type="button"]').click(function() { 
		$('#quiz form').removeClass('active');
		$('#quiz form').fadeOut();
		counter++;
 		$('#quiz form').eq(counter).next().addClass('active');
		$('#quiz form').eq(counter).next().fadeIn();			
	});
});