kirsten/index.html

## index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Kim and Kanye Madlibs!!</title>
  </head>

  <body>
    <div class="inputs">
      <input id="condition-input" placeholder="A Medical Condition"/>
      <button id="condition-button">Click</button>

      <input id="adjective1-input" placeholder="Adjective"/>
      <button class="adjective1-button">Click</button>
    </div>

    <div class="madlib">
      <h1>Kim Kardashian and Kanye West Are Not Divorcing, Says Insider</h1>

      <p>In the wake of Kanye West’s hospitalization for <span id="condition-val"><em>____(a medical condition)_____</em></span> and sleep deprivation last month, all kinds of extreme and <span id="adjective1-val">____(adjective)_____</span> rumors have reared their ugly heads, including some claiming Kim Kardashian and her <span id="noun-val">____(noun)_____</span> are headed for <span id="badsituation-val">____(a bad situation)_____</span>. But don’t fret! According to some reliable sources, that is all just hearsay.</p>

      <p>According to insiders with TMZ, the couple has no plans to <span id="verb1-val">____(verb)_____</span> and are reportedly closer since his time in the <span id="place-val">____(a place)_____</span>. They added that he’s able to start working again but is not taking on big, demanding projects.</p>

      <p>Not convinced that the power couple is returning to normalcy? Word has it Kim and her hubby <span id="verb2-val">____(verb)_____</span> a friend’s house on Tuesday (Dec. 6, 2016) for dinner, a first since he returned home.</p>

    </div>
  </body>
</html>

## popcode.json
{"enabledLibraries":["jquery"]}

## script.js
// Welcome to Kayne and Kim MadLibs!
// This game allows you to plug in certain parts of speech to a story depending on what the user types in.

//Directions: Create an input field and button for each part of speach in the story
//The first blank in this story is already completed for you. The value of what the user types in will be plugged into the story below. Try it out! Then use it as a guide when moving through this project


$("#condition-button").click(function(){
    var condition = $("#condition-input").val();
    $("#condition-val").html(condition);
});


## styles.css
input {
  height: 30px;
  padding: 5px;
  font-size: 28px;
}

button {
  padding: 5px;
  height: 43px;
  vertical-align: top;
  background-color: skyblue;
  width: 75px;
  color: black;
  font-size: 25px;
  border: solid 1px black;
}

span {
  color:red;
}
	<!DOCTYPE html>
	<html>
	<head>
	<title>Kim and Kanye Madlibs!!</title>
	</head>

	<body>
	<div class="inputs">
	<input id="condition-input" placeholder="A Medical Condition"/>
	<button id="condition-button">Click</button>

	<input id="adjective1-input" placeholder="Adjective"/>
	<button class="adjective1-button">Click</button>
	</div>

	<div class="madlib">
	<h1>Kim Kardashian and Kanye West Are Not Divorcing, Says Insider</h1>

	<p>In the wake of Kanye West’s hospitalization for <span id="condition-val"><em>____(a medical condition)_____</em></span> and sleep deprivation last month, all kinds of extreme and <span id="adjective1-val">____(adjective)_____</span> rumors have reared their ugly heads, including some claiming Kim Kardashian and her <span id="noun-val">____(noun)_____</span> are headed for <span id="badsituation-val">____(a bad situation)_____</span>. But don’t fret! According to some reliable sources, that is all just hearsay.</p>

	<p>According to insiders with TMZ, the couple has no plans to <span id="verb1-val">____(verb)_____</span> and are reportedly closer since his time in the <span id="place-val">____(a place)_____</span>. They added that he’s able to start working again but is not taking on big, demanding projects.</p>

	<p>Not convinced that the power couple is returning to normalcy? Word has it Kim and her hubby <span id="verb2-val">____(verb)_____</span> a friend’s house on Tuesday (Dec. 6, 2016) for dinner, a first since he returned home.</p>

	</div>
	</body>
	</html>
	// Welcome to Kayne and Kim MadLibs!
	// This game allows you to plug in certain parts of speech to a story depending on what the user types in.

	//Directions: Create an input field and button for each part of speach in the story
	//The first blank in this story is already completed for you. The value of what the user types in will be plugged into the story below. Try it out! Then use it as a guide when moving through this project


	$("#condition-button").click(function(){
	var condition = $("#condition-input").val();
	$("#condition-val").html(condition);
	});
	input {
	height: 30px;
	padding: 5px;
	font-size: 28px;
	}

	button {
	padding: 5px;
	height: 43px;
	vertical-align: top;
	background-color: skyblue;
	width: 75px;
	color: black;
	font-size: 25px;
	border: solid 1px black;
	}

	span {
	color:red;
	}