JSFiddle - React, Tailwind, and code Playground

by Andrew Gerst

HTML

<a href="#" id="inlink" onclick="return false;">Login</a>
<a href="#" id="outlink" onclick="return false;">Logout</a>
<div id="result"></div>

CSS

#inlink,#outlink {
    display:none;
}

JavaScript

// Full Source: http://pastebin.com/YysAqpQ5

function main(a) {
    var aC = {
        logged: false,
        status: function(){
            alert(aC.logged);
        },
        init: function(){
            aC.loadModule('login');
        },
        loadModule: function(module){
            if (module == "login") {
                $("#inlink").show();
            }
        }
    };
    $(document).ready(function(){
        aC.init();
        $("#inlink").live("click", function() {
            if (!aC.logged) {
                aC.logged = true;
                $("#result").html("Logged");
                $("#outlink").show();
                aC.status();
            }
        });
        $("#outlink").live("click", function() {
            aC.logged = false;
            $(this).hide();
            $("#result").empty();
            aC.status();
        });
        $("#link").live("click", function() {
            $("#result").html("Link Clicked");
        });
    });
    return true;
}

window.$ && main() || (function(){
    var jquery = document.createElement("script");
    jquery.setAttribute("type", "text/javascript");
    jquery.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js");
    jquery.onload = main;
    jquery.onreadystatechange = function() {
        if (this.readyState == "complete" || this.readyState == "loaded") main();
    };
    (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(jquery);
})();