alexpelan/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Make Your Own Madlib!

Get the value of the inputs and append them to the page to create your own madlib!
Create Your Variables, & Get the Input Values


Create adjective and verb variables (we've already created noun for you).
Get the value of the adjective input, and store it in the adjective variable.
Get the value of the verb input, and store it in the verb variable.

Append your variables to the page


Append the adjective variable to the page where it says APPEND ADJECTIVE VARIABLE.
Append the verb variable to the page where it says APPEND VERB VARIABLE.
Test your code! Try entering a few words and hitting the button - does it work?

Finish early?

Add one more input field and a second sentence to the madlib!

  
## index.html
<!DOCTYPE html>
<html>
    <head>
        <title>Make A MadLib</title>
    </head>
    <body>
        <p> Noun (singular): <input id="noun">
        </p>
        <p> Verb (past tense): <input id="verb">
        </p>
        <p> Adjective: <input id="adjective">
        </p>
        <button> MadLib Me!</button>
        <div id="message"></div>

    </body>
</html>

## popcode.json
{"enabledLibraries":["jquery"],"hiddenUIComponents":["console","editor.css"]}

## script.js
$("button").click(function(){

    // CREATE YOUR VARIABLES, AND GET THE INPUT VALUES HERE
    var noun;
    var noun = $("#noun").val();


    $("#message").text("Yesterday, I saw a ");

    // APPEND NOUN VARIABLE HERE
    $("#message").append(noun);
    $("#message").append(" at school, it ");

    // APPEND VERB VARIABLE HERE

    $("#message").append(" suddenly, and I've never felt more ");

    // APPEND ADJECTIVE VARIABLE HERE

    $("#message").append(".");
});
	<!DOCTYPE html>
	<html>
	<head>
	<title>Make A MadLib</title>
	</head>
	<body>
	<p> Noun (singular): <input id="noun">
	</p>
	<p> Verb (past tense): <input id="verb">
	</p>
	<p> Adjective: <input id="adjective">
	</p>
	<button> MadLib Me!</button>
	<div id="message"></div>

	</body>
	</html>
	$("button").click(function(){

	// CREATE YOUR VARIABLES, AND GET THE INPUT VALUES HERE
	var noun;
	var noun = $("#noun").val();


	$("#message").text("Yesterday, I saw a ");

	// APPEND NOUN VARIABLE HERE
	$("#message").append(noun);
	$("#message").append(" at school, it ");

	// APPEND VERB VARIABLE HERE

	$("#message").append(" suddenly, and I've never felt more ");

	// APPEND ADJECTIVE VARIABLE HERE

	$("#message").append(".");
	});