Change background colour of a button on a repeater element

Hello!
I’m trying to achieve something which seems very easy but somehow I can’t.
I have a repeater element which contains few containers and some buttons for each container.
Since every button is considered like a label, I would like to change the colour of the background of these buttons, depending on the text written inside.

I’ve found this piece of code which is not working:

$w.onReady(function() {
$w(“#Section1Repeater1”).onItemReady(($item, itemData, index) => {
if ($w(“#button1”).text === “In-person event”) {
$item(‘#button1’).style.backgroundColor = “#8EE6A6”;
}
if ($w(“#button1”).text === “Online event”) {
$item(‘#button1’).style.backgroundColor = “#FFFFFF”;
}
});
});

Can someone help me on this topic?
Thank you!

$w.onReady(function() {
    $w(“#Section1Repeater1”).onItemReady(($i, iData, i) => {
        if ($i(“#button1”).text === “In-person event”) {
            $i(‘#button1’).style.backgroundColor = “#8EE6A6”;
        }
        if ($i(“#button1”).text === “Online event”) {
            $i(‘#button1’).style.backgroundColor = “#FFFFFF”;
        }
    });
});