Banner to Show/Hide content

<!-- create a link for the banner. When its clicked, it will execute the named javascript function in the onclick event-->
<a onclick="toggleTextUnderBanner()"><img src="INSERT IMAGE LINK HERE"></a>
<!-- create a div for all your text to live in. This will be shown/hidden by clicking the banner. You could also include additional images, tables, links, ect. here-->
<div id="toggleTextDiv" style="display:none;"> <!-- the id 'toggleTextDiv' is what our function will look for and modify the css display for. we want to set the inital display value to NONE so its hidden by default. Exclude style="display:none;" and the text will show on page load-->
<!-- input all your text/images/tables/elements you want hidden here before the closing div-->
<p>My toggled Text</p>
<!-- add a "hide text" link to the bottom-->
<p><a onclick="toggleTextUnderBanner()">Click here to hide text</a></p>
</div>
<!--Now we add the javascript. because we're adding a javascript function, this MUST use a RAW html widget-->
function toggleTextUnderBanner() {
    var toggleTextElement = document.getElementById("toggleTextDiv"); //get a reference to your div
        if (toggleTextElement.style.display === "none") { //is it already set to display:none?
        toggleTextElement.style.display = "block"; //force it to display:block instead, which will make it show
    } else {
        toggleTextElement.style.display = "none"; //its currently showing, make it not show instead.
    }
}
</script>