Приветствую! Помогите совсем несведущему в javascript! Есть элементарный html Код: <div class="news"> <article class="news2">news1</article> <article class="news2" style="display: none;">news2</article> <article class="news3" style="display: none;">news3</article> <article class="news4" style="display: none;">news4</article> <article class="news5" style="display: none;">news5</article> </div> <input class="mybutton" type="" value="Следующая" name=""> Нужно по кнопке "Следующая" отображать новости по-очереди без перезагрузки страницы, при достижении последней новости желательно убить кнопку. Уже 3 часа сижу разбираю как устроены опросы, но так ничего толкового у меня и не вышло. Пробовал какие-то фигни выдумывать Код: $("input.mybutton").on("click", function(){ if(document.getElementById('news1').style.display = 'block') { document.getElementById('news1').style.display = 'none'; document.getElementById('news2').style.display = 'block'; } }); но чё-то бред какой-то
Если уже используется jQuery, то нет смысла в голом js. И у вас news2 и т.д. - это классы, а вы к ним пытаетесь обратится, как к идентификаторам. Вообще, такое лучше с использованием аякса организовать, но если просто показывать/скрывать уже имеющиеся блоки, то так: Код: var counter = 1; var counterMax = 5; $("input.mybutton").on("click", function(){ counter++; $("article[class^=news]").hide(); $("article.news"+counter).show(); if(counter>=counterMax){ $("input.mybutton").hide(); } }); И у вас класс news2 надо на news1 исправить для первого блока (хотя на работоспособность это не повлияет).