CODEWITHSUNDEEP
javascriptjqueryjquery-selectorsjquery-events
Justin Meltzer
Justin Meltzer

Reputation: 13548

How do you switch between two texts in one jQuery call?

Let's say you have a .click() call. What code could you write inside of that .click() call so that each time you click the selected element, you change the text between two strings. I'm assuming .toggle() and .text() would play a role here...

Upvotes: 4

Views: 8728

Answers (4)

Alma
Alma

Reputation: 1

$('#togglep').on('click', function(){
  $(this).text(function(st1,st2){
    if (st2=='MARKO'){return 'POLO'};
    return 'MARKO'
  })
})

Upvotes: 0

hoopyfrood
hoopyfrood

Reputation: 675

Try something along these lines:

$element.bind('click', function() {
    $(this).html($(this).html() == 'string1' ? 'string2' : 'string1');
});

Edit - 2020-01-28

Note that bind() is now deprecated. You should be using on() instead, as of jQuery 1.7+:

$element.on('click', function() {
  $(this).text((i, t) => t == 'string1' ? 'string2' : 'string1');
});

Upvotes: 26

Kon
Kon

Reputation: 27441

Say your clickableElement is a button and you want to toggle the button's text/label:

$('#clickableElement').click(function() {
    var originalValue = $(this).val();
    $(this).val(originalValue == 'string1' ? 'string2' : 'string1');
});

Upvotes: 0

emco
emco

Reputation: 4709

Try this:

$('#someElement').toggle(function(){
   $(this).text('text1');
  }, 
 function(){
   $(this).text('text2');
 }
);

Upvotes: -3

Related Questions