CODEWITHSUNDEEP
jquery
Nasir
Nasir

Reputation: 4865

How do I get this more... text to change after a slideToggle() has happened, using Jquery?

I have this piece of JQuery:

$('.myAuctionPanel h3').click(function(){

        $(this).next().slideToggle();

        $(this).children().text("more...");
});

This is what happens so far...when I click on the <h3> a div underneath it does a slideToggle(). Inside the <h3> I have a <span> which then shows the 'more...' text.

My question is when I click the <h3> again how do I get the text inside the span to change to 'less...'?

Any help is Greatly Appreciated, Thanks

Upvotes: 1

Views: 435

Answers (1)

lonesomeday
lonesomeday

Reputation: 237817

You can use the .toggle() function, which accepts multiple arguments. These are functions that are called in turn upon click events:

$('.myAuctionPanel h3').toggle(function(){
    $(this).next().slideToggle();

    $(this).children().text("more...");
}, function(){
    $(this).next().slideToggle();

    $(this).children().text("less...");
});

Upvotes: 2

Related Questions