kklai/html

## html
<html>
<head>
  <title></title>
  <style type="text/css">
  body {
    padding: 25%;
  }
  </style>
</head>
<body>

  <input id="hello">

  <button id="button">SUBMIT</button>


  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
  <script type="text/javascript">

      ///////////////// part 1 /////////////////

      // function to add parameter to url
      function insertParam(key, value) {
          var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + "?&" + key + "=" + value;
          window.history.pushState({path:newurl},'',newurl);
      }


      // click button and add user input to url
      $("#button").on("click", function(d){
        var response = $("#hello").val();
        insertParam("userResponse", response);
      })


      ///////////////// part 2 /////////////////


      // detect parameter on load
      var userResponse = location.search.split('userResponse=')[1]

      if (userResponse) {
        $("body").append("<h1>" + userResponse +"</h1>")
      }

  </script>

</body>
</html>
	<html>
	<head>
	<title></title>
	<style type="text/css">
	body {
	padding: 25%;
	}
	</style>
	</head>
	<body>

	<input id="hello">

	<button id="button">SUBMIT</button>


	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
	<script type="text/javascript">

	///////////////// part 1 /////////////////

	// function to add parameter to url
	function insertParam(key, value) {
	var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + "?&" + key + "=" + value;
	window.history.pushState({path:newurl},'',newurl);
	}


	// click button and add user input to url
	$("#button").on("click", function(d){
	var response = $("#hello").val();
	insertParam("userResponse", response);
	})



	///////////////// part 2 /////////////////


	// detect parameter on load
	var userResponse = location.search.split('userResponse=')[1]

	if (userResponse) {
	$("body").append("<h1>" + userResponse +"</h1>")
	}

	</script>

	</body>
	</html>