Challenge 17

AJAX Requests

by Jaron Mauk

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<body>
<div class="container">

<h1>Jaron's AJAX Test</h1>

<button id='addcard'>See Jaron's profile</button>
<div id="output"></div>
</div>

</body>

CSS

//so I have made the card but for some reason the button wont show what I have made.

JavaScript

$(document).ready(init);

function init(){
	$('#addcard').click(addcardHandler);
}

function addcardHandler(){
	$.get('http://api.github.com/users/jaronmauk5')
  
  .done(function(data, status){
  	console.log("data:", data);
    console.log('status:', status);
    
    var $card = makeCard(data);
    $('#output').append($card);
  })
	
  .fail(function(data, status){
  	console.log("data:", data);
    console.log('status:', status);
	})

}

function makeCard(data){
	var $card = $('<div>').addClass('card');
  var $avatar = $('<img>').attr('src', data.avatar_url);
  var $name = $('<div>').text(data.name);
  $card.append($avatar).append($name);
  return $card;
}