Here is my working example trying to load a file from github:
<html>
<head><title>Get Gists</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
var url = "https://gist.github.com/2406934.js?file=check-jquery-load";
$.getJSON(url + "?callback=?", null, function(gist) {
alert(gist);
$("#gist-info").append(gist);
});
});
</script>
<div id='gist-info'></div>
</body>
</html>
You pretty much have 2 issues here. Cross-domain and the fact that the fragment that's being returned is not exactly a JSON. It's in between an HTML and a Javascript.
You definitely need a helper method to parse the returned object since it's performing a document.write().
See the following link which pretty much solves the same issue that you're having: Loading GitHub Gist
This is what your Gist looks like in action when put together: Link