So what I'm trying to do is get the content in <div id=content> to show if the page has been "liked". I got it to work if the user has just pressed the like button, but if the page refreshes, or the user comes back at a later time, it remembers that the user likes the page (of course), but it does not show the content in <div if=content> unless the user unlikes and then likes the page again. Im guessing this is because what the code is referencing is some sort of click event, rather than if the page is liked or not.

Here is the link:

Here is the code:

<html xmlns=""
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>WD Fan Page</title>
<meta property="og:title" content="WD Fan Page"/>
<meta property="og:type" content="company"/>
<meta property="og:url" content=""/>
<meta property="og:site_name" content="WD Fan Page"/>
<meta property="fb:admins" content="560504907"/>
<meta property="og:description"
content=" fan page Like"/>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
#content { 
display: none;
padding: 20px 0 0 0;
    <h1>WD Fan Page</h1>
<div id="fb-root"></div>
<p><fb:login-button autologoutlink="true"></fb:login-button></p>

window.fbAsyncInit = function() {
FB.init({appId: '205453252832209',
status: true, 
cookie: true,
xfbml: true});
 FB.Event.subscribe('auth.login', function() {

FB.Event.subscribe('edge.create', function(href, widget) {
FB.Event.subscribe('edge.remove', function(href, widget) {
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
e.async = true;


<div id="content"> This content shows up when user likes page <br />
if you unlike this page it will go away!