jQuery hide and show multiple divs
<p>I got an html form with 3 questions, each question inside a div:</p>

<pre><code>&lt;div id="question1"&gt;
question1
&lt;/div&gt;

&lt;div id="question2"&gt;
question2
&lt;/div&gt;

&lt;div id="question3"&gt;
question3
&lt;/div&gt;
</code></pre>

<p>and a button at the very end:</p>

<pre><code>&lt;button id="next"&gt;Next question&lt;/button&gt;
</code></pre>

<p>What i want - only 1st div shown at first. I press the button -> 2nd div loads, 1st div hides. I press the button one more time -> 2nd div hides, 3rd div shows up.</p>

<p>Here is how i tried:</p>

<pre><code>&lt;script&gt;
$('#question2').hide();
$('#question3').hide();

    $("#next").click(function (e) {
        event.preventDefault();
        $('#question1').hide();
        $('#question2').show();
    });
&lt;/script&gt;
</code></pre>

<p>I dont know how to load the 3rd div.</p>
