Button/DIV toggle

Question

I have a button, the label of which I want to change back and forth as it is clicked. I found this thread

and this example

which is great but I'm trying to figure out how to actually change the label (say, from "up" to "down" when it is clicked).

Would appreciate any help.

score 2 · Answer 1 · answered Apr 05 '12 at 13:26

2

I have chaned the fiddle

Updated Fiddle

answered Apr 05 '12 at 13:26

Amritpal Singh

1,765
1
13
20

score 2 · Accepted Answer · answered Apr 05 '12 at 13:30

2

You can check the class by using .hasClass();

if ($(this).hasClass("down"))
{
    $(this).html("Down!");
}
else
{
    $(this).html("Up!");
}

In your code: http://jsfiddle.net/Before/XNQce/2/

answered Apr 05 '12 at 13:30

ONOZ

1,390
2
11
19

score 1 · Answer 3 · answered Apr 05 '12 at 13:28

That's simple.

$(document).ready(function(){
var i=0;
$('a#button').click(function(){
    $(this).toggleClass("down");
    if(i%2==0)$(this).html('divide by 2');
    else $(this).html('not divide by 2');
    i++;            
});
});

using a variable you can check what state is your button in. Above code is just a crude of that type of state management.

check this http://jsfiddle.net/LmULE/100/

Button/DIV toggle

3 Answers3