I will give a simple page-flipper here to get you started with your Assignment3 story. Here is how I did the markup for the first three pages of my story:

<main>
<section id="p1">
<p>First page of the story.</p>
</section>
<section id="p2">
<p>Second page of the story.</p>
</section>
<section id="p3">
<p>Third page of the story.</p>
</section>
</main>
<div id="controls"><button id="continue">Continue</button></div>

This JavaScript will start on page 1, transition to page 2 when the button is clicked, and get ready for the page 2 to 3 transition (which you need to write). You are expected to make the transitions more interesting, and fill in the story.

to_p2 = function() {
  /* flip from p1 to p2 */
  $('#p1').hide()
  $('#p2').show()
  $('#continue').off()
  $('#continue').click(to_p3)
}
to_p3 = function() {
  /* flip from p2 to p3 */
}

setup = function() {
  $('#continue').click(to_p2)
  $('section').hide()
  $('#p1').show()
}
jQuery(document).ready(setup)

The .off() function used here removes the previously-applied click event handler so it no longer fires. After that, we replace it with a new event handler, thus changing the behaviour of the button.