Показ следующего числа в зависимости от нажатой кнопки

[TTATPuOT]

Здравствуйте!
Сразу к сути, есть задача создать что-то вроде карусели.

Как это должно работать:
Есть две кнопки "Больше" и "Меньше". И дано 5 функций (в моём примере каждую функцию я заменю на числа 1,2,3,4,5).
По умолчанию на экране есть эти две кнопки и цифра 1. При клике не кнопку "Больше", выполняется вторая функция (в нашем случае появляется цифра 2), далее, при очередном клике на "Больше" появляется цифра 3 и т.д.
А если нажать на кнопку "Меньше", то число, соответственно, будет ниже.

Чего только не перепробовал, и .toggle, и циклы - ничего не работает. Буду очень благодарен.

[Lemme]

<div>
    <button id="prev"><</button>
    <span>3</span>
    <button id="next">></button>
</div>

<script>
	document.querySelector('div').onclick = function(event) {
		var maxValue = 5;
	    if (event.target.id === 'prev') {
	        var counter = event.target.nextElementSibling;
	    	if (+counter.innerHTML > 0) {
	        	counter.innerHTML--;
	        }
	    }
	    if (event.target.id === 'next') {
	        var counter = event.target.previousElementSibling;
	    	if (+counter.innerHTML < maxValue) {
	        	counter.innerHTML++;
	        }
	    }
	}
</script>