Show hidden div (slide) when click on button (change text)
<p>I have a page where I want to hide some content (#hidden_content) as default. On this page there is a CSS button with text example "Show content".</p>

<p>When click on this button I want the div #hidden_content to show with a slide effect and at the same time the text on the button "Show content" will change to example "Hide content" and when click the content will hide again.</p>

<p><strong>Button</strong></p>

<pre><code>&lt;a href="" id="button" class="button_style"&gt;Show content&lt;/a&gt;
</code></pre>

<p><strong>Div</strong></p>

<pre><code>&lt;div id="hidden_content"&gt;Content&lt;/div&gt;
</code></pre>

<p><strong>Slide script</strong></p>

<pre><code>$(document).ready(function(){
  $("#button").click(function(){
    $("#hidden_content").slideToggle("slow");
  });
});
</code></pre>

<p>Now I want the text on the button so change when click. How do I do that?</p>

<p>Thanks.</p>
