Ornataweaver · November 12, 2018 10:37
diff --git a/index.html b/index.html
 <body class="text-center">
  <br>
  <h2>Jokes that I connected via Ajax:</h2>
  <p class="message">
    The joke will go here
  </p>
  <button id="getQuote">
    Get Message
  </button>
 </body>
diff --git a/joke-json-api-ajax.markdown b/joke-json-api-ajax.markdown
diff --git a/script.js b/script.js
 $(document).ready(function() {
  // twttr.widgets.load();
  // function getQuote(){}
  $("#getQuote").on("click", function(){
    var html = "";
    $.getJSON("https://api.icndb.com/jokes/random.json", function(obj) {
          html += "<div>";
          html += obj["value"]["joke"] + "<br>" + "<strong>" + "from 'https://api.icndb.com/jokes/random/' " + "JokeID=" + obj["value"]["id"] + " " + "</strong>" + "<br>" ;
          html += "</div>";
          $(".message").html(html);
    });
  });
 });
diff --git a/scripts b/scripts
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
diff --git a/style.css b/style.css
 body {
  background: #aa0;
  /* text-align: center; */
  font-family: monospace;
  color: #000;
  font-size: 20px;
 }
 button {
  border-radius: 5px;
 }
diff --git a/styles b/styles
 <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet" />
	<body class="text-center">
	<br>
	<h2>Jokes that I connected via Ajax:</h2>
	<p class="message">
	The joke will go here
	</p>
	<button id="getQuote">
	Get Message
	</button>
	</body>
	$(document).ready(function() {
	// twttr.widgets.load();
	// function getQuote(){}
	$("#getQuote").on("click", function(){
	var html = "";
	$.getJSON("https://api.icndb.com/jokes/random.json", function(obj) {
	html += "<div>";
	html += obj["value"]["joke"] + "<br>" + "<strong>" + "from 'https://api.icndb.com/jokes/random/' " + "JokeID=" + obj["value"]["id"] + " " + "</strong>" + "<br>" ;
	html += "</div>";
	$(".message").html(html);
	});
	});
	});
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>