Question

I have the following code in my head

jQuery(document).ready(function() {
    var pic = 0;
    FB.init({appId: '135570939849404', status: true, cookie: true, xfbml: true});
    session = FB.getSession();
        if (session) {
                pic = "http://graph.facebook.com/" + session.uid + "/picture";  
        } 
});
</script>

and the following code in the body:

<script type="text/javascript">
                                    document.write("<img src=\"" + pic + "\" class=\"avatar\">");
                            </script>

Why is it that in the console it always gives me:

Uncaught ReferenceError: pic is not defined

I have changed var pic to just pic, to make it global… however, still the problem persists

Answer 1

Dont Do it in the body tag. Instead Do it like this

<script>
jQuery(document).ready(function() {
    var pic = 0;
    FB.init({appId: '135570939849404', status: true, cookie: true, xfbml: true});
    session = FB.getSession();
        if (session) {
                pic = "http://graph.facebook.com/" + session.uid + "/picture";  
        } 
        document.write("<img src=\"" + pic + "\" class=\"avatar\">");
});
</script>