How to make text expand and other text collapse on click of a button

Hi there!
I would like to know how to make a text expand and another text collapse when clicking a button.

I have these buttons. And my goal is to make text appear for each button. But when I click one button I want the previous text to disappear. Example: I click the button “worry” and text01 appear. I then click the button named Overwhelment, then text01 disappears and text02 appears.

I have managed to make the text expand on click but I am having trouble making the previous text (that expanded when another button was clicked) collapse. Right now I have this ridiculous long statement in an attempt to make all other text collapse. And it doesn’t work (hey, I’m no coder obvs). Here it goes:

 // API Reference: https://www.wix.com/velo/reference/api-overview/introduction
// “Hello, World!” Example: https://learn-code.wix.com/en/article/1-hello-world

$w.onReady(function () {
    // Write your JavaScript here

    // To select an element by ID use: $w('#elementID')

    // Click 'Preview' to run your code
});

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button2_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#text01').expand();
        $w('#image01').expand();
    $w('#text02','#text03','#text04','#text05','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image02','#image03','#image04','#image05','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button02_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#text02').expand();
        $w('#image02').expand();
    $w('#text01','#text03','#text04','#text05','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image03','#image04','#image05','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button03_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#text03').expand();
        $w('#image03').expand();
    $w('#text01','#text02','#text04','#text05','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image04','#image05','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button04_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#image04').expand();
        $w('#text04').expand();
    $w('#text01','#text02','#text03','#text05','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image05','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button05_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#text05').expand();
        $w('#image05').expand();
    $w('#text01','#text02','#text03','#text04','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button06_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here:   
        $w('#image06').expand();
        $w('#text06').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse(); 
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button07_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#image07').expand();
        $w('#text07').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button08_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here:
        $w('#image08').expand();
        $w('#text08').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text07','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image07','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse(); 
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button09_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here:
        $w('#image09').expand();
        $w('#text09').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text07','#text08','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image07','#image08','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button010_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#image10').expand();
        $w('#image10').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text07','#text08','#text09','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image07','#image08','#image09','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button011_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#image11').expand();
        $w('#text11').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text07','#text08','#text09','#text10','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image07','#image08','#image09','#image10','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

/**
*   Adds an event handler that runs when the element is clicked.
    [Read more](https://www.wix.com/corvid/reference/$w.ClickableMixin.html#onClick)
*    @param {$w.MouseEvent} event
*/
export function button12_click(event) {
    // This function was added from the Properties & Events panel. To learn more, visit http://wix.to/UcBnC-4
    // Add your code for this event here: 
        $w('#image10').expand();
        $w('#text10').expand();
    $w('#text01','#text02','#text03','#text04','#text05','#text06','#text07','#text08','#text09','#text10','#text11','#text12','#text13','#text14','#text15','#text16','#text17','#text18','#text19').collapse();
    $w('#image01','#image02','#image03','#image04','#image05','#image06','#image07','#image08','#image09','#image10','#image11','#image12','#image13','#image14','#image15','#image16','#image17','#image18','#image19').collapse();
}

Okay, so I am referring to the ‘#text01’,‘#text02’,'#text03 and so on. Is there any way to have it like #text01-text10… or something? Cos this is obvs not working out for me lol.

Super thankful for any help I can get!

With the caveat that I’m a beginner at both JavaScript and Velo, two possible solutions occur to me:

  1. Write a function that collapses ALL text and images. Then, for each button that expands a text / image pair, FIRST call that collapse function, THEN expand the appropriate text / image pair.

  2. Rewrite the button code so that it also stores the identity of the pair that is being expanded. Then your button code could collapse the old pair (as identified in the variable), expand the new pair, and store the identify of the new pair in the variable.