show-hide left menu

by Tom Scott

HTML

<div> <a id="setup" href="javascript:;"> 
    Show Content ▼
    </a>
</div>

<div id="closeable" style="display:none">
    <h3>I want this content HIDDEN until Clicked and the Show Content link to be like: Show Content &#x25BC;
    </h3>    
    </div>
<div> <a id="setup2" href="javascript:;"> Show Content ▼</a> 
</div>

<div id="closeable2" style="display:none">I want this content HIDDEN until Clicked and the Show Content link to be like: Show Content &#x25BC;</div>

CSS

#setup {
    width: 350px;
    height: 30px;
    padding:0px;
    border: 1px gray solid;
    margin-bottom: 5px;
    color:gray;
}
#setup2 {
    width: 350px;
    height: 30px;
    padding:0px;
    border: 1px gray solid;
    margin-top: 5px;
    color:gray;
}

div h3 {
    background-color:white;
    color:blue;
    width: 
}

a {
    color:white;
    text-decoration:none;
}
}

JavaScript

$(document).ready(function () {
    $("#setup").click(function () {
        $("#closeable").slideToggle(function () {
            if ($(this).is(":visible")) {
                $("#setup").text("Hide Content ▲");
            } else {
                $("#setup").text("Show Content ▼");
            }
        });
    });
       $("#setup2").click(function () {
        $("#closeable2").slideToggle(function () {
            if ($(this).is(":visible")) {
                $("#setup2").text("Hide Content ▲");
            } else {
                $("#setup2").text("Show Content ▼");
            }
        });
    });
});