Is there a bootstrap or jquery element for button to change when clicked

Question

I'm looking at the airbnb.com website and the form that allows me to create a new room has buttons that change when clicked.

Here is what it looks like before I click 'Apartment' enter image description here

Here is what it looks like after I click 'Apartment' enter image description here

Is this something that I can get from a jquery library or use from bootstrap or do I have to make this myself?

I'd like to replicate this in my site..

Seems to me they remove elements on `.click()` event. You van remove them with `.remove()` — ImAtWar, Mar 03 '15 at 08:42
how do they get the other buttons to hide and the text to appear when one is clicked? is it hidden or something? It looks like the text scrolls in from the right — chuckd, Mar 03 '15 at 09:03

score 1 · Answer 1 · edited May 23 '17 at 12:21

Maybe something like this can be useful... It is only an idea, because you didn't post any code :)

$('#btnGo').click(function(e) {
    e.preventDefault();  
    // set css classes and text of button
    $(this)
        .removeClass('btn-primary')
        .addClass('btn-danger disabled') // with *disabled* I'm sure that the button is not clickable
        .text('WAIT');

and after your event, e.g. you can return to initial condition...

$('#btnGo')
    .removeClass('btn-danger disabled')
    .addClass('btn-primary') 
    .text('GO');

where for example id='btnGo' can be one of your buttons..

Is there a bootstrap or jquery element for button to change when clicked

1 Answers1