Here is a link to a page where I am experimenting with creating an interactive choose-your-own-adventure story:
My goal is to add the class "disabled" to the element when a user clicks on the word "stairs" and then continue the story. Below is the relevant code snippet extracted from the page:
<div id="ongoingStory"><p>This wasn't where you meant to go.</p>
<p>You were walking, and thinking, and now that you've come back to the present, you're looking at brick on two sides and a slatted, padlocked gate between them. You've come up an alley. Or down one.</p>
<p>Up a set of <a href="#" id="stairs">stairs</a> bolted precariously to one building's brick side, there's a door. Above it, a sign juts out: <span class="smcaps">Sparrow Aisling / Psychic</span>. Barely readable in the dusk, but there it is.</p></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="narrative.js"></script>
and excerpt from narrative.js --
var climbStairs = "<p>You climb the stairs and go through the door.</p><p>Inside, there's a red velvet sofa, diamond-tufted, and an ottoman to one side. Heavy green curtains and a spray of tiny, ornately framed <a href=\"#\">mirrors</a> occupy the back wall. Occult clutter fills the rest of the room — candles in cups, crystals, brass bells and bowls, figurines from a number of different religions, a little round tea set, and bundles of dried herbs and sticks.</p><p>The obligatory cat, gray, looks up at you, twitches its tail, and goes back to staring out the room's one window.</p><ul><li><a href=\"#\"> Sit and wait.</a></li><li><a href=\"#\"> Nose around while you wait.</a></li></ul>"
$( document ).ready( function() {
$( "#stairs" ).click( function() {
$( this ).addClass( "disabled");
$( "#ongoingStory" ).append( climbStairs );
});
});
It has been a long time since I attempted anything more interactive than a menu bar, so please bear with me. I may have made errors in the syntax or order of things, failed to escape something that needed escaping, or overlooked something very basic.