Changing the text when toggle
<p>I am trying to change the text when the user clicks but does not seems to work ..below is the code.</p>

<p>not working sample: <a href="http://jsfiddle.net/3jt3P/1/" rel="nofollow">http://jsfiddle.net/3jt3P/1/</a></p>

<pre><code>&lt;a href="#" class="slide" onclick="firstclick();"&gt;Show First&lt;/a&gt; ... 
&lt;a href="#" class="slide1" onclick="secondclick();"&gt;Show Second&lt;/a&gt;

&lt;div id="one" class="content"&gt;one&lt;/div&gt;
&lt;div id="second" class="content"&gt;two&lt;/div&gt;


&lt;script type="text/javascript"&gt;

        function firstclick() { 
            $('#second').hide();
            $('#one').slideToggle(400, function () {
                debugger
                if ($(this).is(":visible")) {
                    $('.slide &gt; a').text('Hide First');
                    $('.slide1 &gt; a').text('Second');
                }
                else {
                    $('.slide &gt; a').text('First');
                } 
            });
            return false;

        } 
        function secondclick() { 
            $('#one').hide();
            $('#second').slideToggle(400, function () {

                if ($(this).is(":visible")) {
                    $('slide1 &gt; a').text('Hide Second');
                    $('slide &gt; a').text('First');
                }
                else
                    $('slide1 &gt; a').text('First');

            });
            return false;
        } 

        $(document).ready(function () {
            // Hide the "view" div.
            $('#one').hide();
            $('#second').hide();

        });
    &lt;/script&gt;
</code></pre>
