このコードでリソースを取得できないのはなぜですか？

Question

私はFacebookから画像を取得しようとしています。なぜこのコードが画像を取得しないのですか？

<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script> 

<div id="fb-root"></div> 
    <script type="text/javascript"> 
window.fbAsyncInit = function() { 
     FB.init({ 
      appId:XXXXX, cookie: true, status: true, xfbml: true 
     }); 
}; 

    (function() { 
    var e = document.createElement('script'); 
    e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; 
    e.async = true; 
    document.getElementById('fb-root').appendChild(e); 
    }()); 
</script> 

<script> 
var profilePicsDiv = document.getElementById('profile_pics'); 
FB.getLoginStatus(function(response) { 
    if (response.status != 'connected') { 
    profilePicsDiv.innerHTML = '<em>You are not connected</em>'; 
    return; 
    } 

    FB.api({ method: 'friends.get' }, function(result) { 
    Log.info('friends.get response', result); 
    var markup = ''; 
    var numFriends = result ? Math.min(5, result.length) : 0; 
    if (numFriends > 0) { 
     for (var i=0; i<numFriends; i++) { 
     markup += (
      '<fb:profile-pic size="square" ' + 
          'uid="' + result[i] + '" ' + 
          'facebook-logo="true"' + 
      '></fb:profile-pic>' 
     ); 
     } 
    } 
    profilePicsDiv.innerHTML = markup; 
    FB.XFBML.parse(profilePicsDiv); 
    }); 
}); 
</script> 

Answer 1

あなたのdivが欠けている<：

<div id="profile_pics"></div>