JavaScript calling show hide methods
<p>I'm a complete newbie to JavaScript trying to understand simple things....</p>

<p>Please look at complete code below. It's simple, show and hide.
I'm doing something wrong due to which it's not working.</p>

<p><a href="http://jsbin.com/esokic/edit#javascript,html,live" rel="nofollow">http://jsbin.com/esokic/edit#javascript,html,live</a></p>

<p>Would appreciate any help..</p>

<pre class="lang-html prettyprint-override"><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;

&lt;head&gt;
&lt;meta content="text/html; charset=utf-8" http-equiv="Content-Type" /&gt;
&lt;title&gt;Close&lt;/title&gt;
&lt;SCRIPT type="text/javascript" src="jquery.all.min.js"&gt;&lt;/SCRIPT&gt;

&lt;style type="text/css"&gt;
.header-nav-outer {
    float: left;
}
.get-daily-alerts-outer {
    background: rgb(161, 8, 8); border-width: 0px 2px 2px; border-style: solid; border-color: rgb(0, 0, 0); padding: 2px 10px 20px 20px; border-radius: 0px 0px 8px 8px; width: 477px; height: 88px; display: none; position: absolute; z-index: 1000; -moz-border-radius: 0 0 8px 8px; -webkit-border-radius: 0 0 8px 8px;
}
span.close {
    background: url("/img/snapdeal/sprite/snapdeal.png?v=1") no-repeat -674px -748px; padding: 1px 0px 1px 16px; color: rgb(255, 255, 255); font-size: 10px; cursor: pointer;
}
.get-daily-alerts-head {
    color: rgb(224, 220, 220); padding-bottom: 10px; font-size: 19px; font-weight: bold;
}
.get-daily-alerts-head span {
    font-size: 13px; font-weight: normal;
}
.header-top-nav {
    background: url("/img/snapdeal/sprite/snapdeal-x.png?v=1") repeat-x left -73px; margin: 0px 0px 3px 170px; width: 592px; height: 32px; overflow: hidden;
}
.get-deal-alerts {
    background: url("/img/snapdeal/sprite/snapdeal.png?v=1") no-repeat -565px -803px rgb(161, 8, 8); padding: 3px 5px; width: 115px; color: rgb(255, 255, 255); font-size: 11px; float: left; cursor: pointer; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px;
}
.csupport-drop-outer {
    float: right;
}
.csupport-drop {
    width: 120px !important; display: block;
    text-align: left;
    color: #C7C5C5;
    font-size: 11px;
    font-weight: normal;
    cursor: pointer;
}
span.selected-city {
    background: url("/img/snapdeal/sprite/snapdeal.png?v=1") no-repeat right 3px; padding-right: 20px;
}
.cust-support-outer {
    margin: 0px; width: 121px; height: auto;
    background: rgb(255, 255, 255); border-width: 0px 2px 7px; border-style: solid; border-color: rgb(0, 0, 0); margin: 0px; padding: 5px 2px; position: absolute; z-index: 1000 !important; border-radius: 0px 0px 7px 7px; -moz-border-radius: 0 0 7px 7px; -webkit-border-radius: 0 0 7px 7px;

}

ul.cust-support {
    background: rgb(255, 255, 255); list-style: none; margin: 0px; padding: 0px; color: rgb(94, 94, 94); font-size: 12px;
}
ul.cust-support li {
    margin-top: 1px;
    margin-right: 5px;
    border-bottom-color: #888484;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
}
ul.cust-support li a {
    list-style: none;
    margin: 0px 0px 1px;
    padding: 3px;
    color: #5E5E5E;
    font-size: 12px;
    display: block;
    cursor: pointer;
    _cursor: hand;
}
.active-drop-tab {
    background: rgb(255, 255, 255); border-width: 2px 2px 0px; border-style: solid; border-color: rgb(0, 0, 0); color: rgb(51, 176, 212); cursor: default; -moz-border-radius: 8px 8px 0 0; -webkit-border-radius: 8px 8px 0 0;
}

&lt;/style&gt;
&lt;script type="text/javascript"&gt;
this.init=function(){
    $(".csupport-drop").click(function(){
        $(".csupport-drop").addClass("active-drop-tab");
        $(".cust-support-outer").show();
        return false
    });
    $(".close").click(function(){
        $(".get-daily-alerts-outer").hide();
        return false
    });
    $(".get-deal-alerts").click(function(){
        $(".get-daily-alerts-outer").show();
        return false
    });
};
&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
    &lt;DIV class="header-nav-outer"&gt;
        &lt;DIV class="get-daily-alerts-outer"&gt;
            &lt;DIV align="right"&gt;&lt;SPAN class="close"&gt;Close&lt;/SPAN&gt;&lt;/DIV&gt;
            &lt;DIV class="get-daily-alerts-head"&gt;Get The Best Deals &lt;SPAN&gt;Everyday in your 
            mailbox&lt;/SPAN&gt;&lt;/DIV&gt;
        &lt;/DIV&gt;
        &lt;DIV class="header-top-nav"&gt;
            &lt;DIV class="get-deal-alerts"&gt;Get daily deal alerts&lt;/DIV&gt;
            &lt;DIV class="csupport-drop-outer"&gt;
                &lt;DIV class="csupport-drop"&gt;&lt;SPAN class="selected-city"&gt;Customer 
                    Support&lt;/SPAN&gt;&lt;/DIV&gt;
                &lt;DIV class="cust-support-outer" style="display:none;"&gt;
                &lt;UL class="cust-support"&gt;
                    &lt;LI&gt;&lt;A&gt;&lt;SPAN id="orderStatus"&gt;Order Status&lt;/SPAN&gt;&lt;/A&gt;&lt;/LI&gt;
                    &lt;LI&gt;&lt;A&gt;&lt;SPAN id="voucherResend"&gt;Resend Voucher&lt;/SPAN&gt;&lt;/A&gt;&lt;/LI&gt;
                    &lt;LI&gt;&lt;A href="http://www.snapdeal.com/info/contactus" target="_blank"&gt;Contact 
                        Us&lt;/A&gt;&lt;/LI&gt;&lt;/UL&gt;&lt;/DIV&gt;
        &lt;/DIV&gt;
    &lt;/DIV&gt;
&lt;/body&gt;

&lt;/html&gt;
</code></pre>
