Question

I was watching a tutorial for using the JQuery toggle, and I want to use it on my site, But the thing is I want to div to be hidden initially on page load so, When somebody visit the page It is only a button saying some text to show the content, and when that button is clicked, then toggle and show the content, But as I am new I don’t know how to stop its default opened state:

function random_script(element,speed){
$(element).toggle(speed);
}

<input type="button" value"Show Results?" onClick="random_script('#somediv',1000);"/>
<div id="somediv"></div>

So is there any solution for this?

Answer 1

<a href="javascript:void(0)" onClick="random_script('#somediv',1000);">Show Results?</a>
<div id="somediv" style="display:none;"></div>

Alternative with JQuery (jsfiddle):

<script type="text/javascript">
    ​$('.showResult')​.click(function (){
        $(this).next('.result').toggle();
    });​​​​​​
</script>
<style>
    ​.result {
        display: none;
    }​
</style>

<a href="javascript:void(0)" class="showResult">Show Results?</a>
<div class="result">Some Result​​​​​​​​​​​​​​​​​​​​​​​​​​</div>​​​​​​​​​​​​​​​​​​​​​​