Post
Ask Question
Gurpreet Arora

Gurpreet Arora

  • 203
  • 9.5k
  • 657.8k

Hide and show multiple div with a single button click ?

Jul 16 2018 1:03 AM
I am New to JS

I am trying Questions Page in javascript

Like
Multiple Question Coming one by one
2 Button back and Next
i want when i check on next current div hide and next div(question) Show when click on back previous div show and current hide

Multiple div are there
Please help me
 
What I have tried:

$('a.slick-hide').bind('click', function(){
var $div1 = $('#box1'), $div2 = $('#box2')
if ( $div2.is(':visible') ) {
$div2.hide();
} else if ( $div1.is(':visible') && $div2.is(':hidden) ) {
$div1.hide();
} else {
$div1.show();
$div2.hide();
}
});
 
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script type="text/JavaScript" src="test.js">
</script>
</head>
</head>
<body>
<div id="box1">
<p> JavaScript is the programming language of HTML and the Web. <br />
Programming makes computers do what you want them to do. <br />
JavaScript is easy to learn. </p>
</div>
<div id="box2">
<p>hello</p>
</div>
<a class="slick-hide" href="#">link</a>
</body>
</html>

Answers (3)