Question: Here's my HTML when the questionnaire starts:

```
<form id="questionnaire">
  Question 1: Do you like dogs?<br>
  <input type="radio" name="answer" value="yes">Yes<br>
  <input type-"radio" name="answer" value="no">No<br>
  <input type="submit" value="Next Question" />
</form>

```

Here's my Javascript so far:

```
$(document).ready(function(){

    var q2 = 
      'Question 2: Do you like cats?
       <input type="radio" name="answer" value="yes">Yes<br>
       <input type-"radio" name="answer" value="no">No<br>
       <input type="submit" value="Next Question" />'

      $('#questionnaire').submit(function(){
        $('#questionnaire').html(q2); // This puts the Question 2 HTML into the form
        return false;
      });

    var q3 = 
      'Question 3: Do you like bunnies?
       <input type="radio" name="answer" value="yes">Yes<br>
       <input type-"radio" name="answer" value="no">No<br>
       <input type="submit" value="Next Question" />'
});

```

What kind of function do I write so that after Question 2 loads, clicking the "Next Question" button leads to Question 3?

Answer: 
Here's one way to do it: <http://jsfiddle.net/zXM74/2/>

```
var questions = {
    2: 'Question 2: Do you like cats?' +
       '<input type="radio" name="answer" value="yes">Yes<br>' +
       '<input type="radio" name="answer" value="no">No<br>',
    3: 'Question 3: Do you like bunnies?' +
       '<input type="radio" name="answer" value="yes">Yes<br>' +
       '<input type="radio" name="answer" value="no">No<br>'
    };

var current_question = 1;

$('#questionnaire').submit(function(){
    current_question++;
    $('#questionnaire #question').html(questions[current_question]);
    return false;
});​

```

You keep a variable storing the current question, use that variable to index into an object or array to fetch the right question to display, and increment the variable whenever the button is pressed.

Also requires a small change to your HTML to surround the actual question in a div of its own, separate from the submit button:

```
<form id="questionnaire">
  <div id="question">
      Question 1: Do you like dogs?<br>
      <input type="radio" name="answer" value="yes">Yes<br>
      <input type="radio" name="answer" value="no">No<br>
  </div>
  <input type="submit" value="Next Question" />
</form>​

```
I would put all of your questions in the HTML separated into different DIVs. Each DIV should have a unique id. Only the first question would be displayed, the rest would be hidden.

You could put the next question's id into the submit input from the previous question, like so...

```
<input id="2" type="submit" value="Next Question" />

```

Create a delegate to catch when a submit button has been clicked, capture the id, hide question `id-1`, show question `id`.