How to change a property of an html element only by id

Dash Python
1

Hi,
I generate 10 Divs with Text inside:

app.layout = html.Div(
        html.Div([
        html.H1('Enter your name:'),
        dcc.Input(id = 'player_name_input', type = "text", debounce = True, placeholder = "", style = span_style),
        html.Button("Start", id = "start", n_clicks = 0),
        html.Span(id = "player_name", children = "", style = span_style),
        html.Span(id = "timer_display", children = "", style = span_style),
        dcc.Interval(id="interval-component", interval=100, n_intervals=0, disabled=True)
                   ] +
        [
             html.Div(id="cable_{}".format(cable["GPIO"]),
                 children = [ html.H4(children = "{}".format(cable['Name'])) ] ) for cable in cable_data
        ]
                 )
)
....
@app.callback(
        Output("timer_display", "children"),
        Input("interval-component", "n_intervals"),
)
def update_layout(n):
    #calculate remaining time in ms
    remaining = time_interval_ms - (n * 100)
    minute = (remaining // 60000)
    second = (remaining % 60000) // 1000
    milisecond = (remaining % 1000) // 10

    for cable in cable_data:
         print(cable)
#
#  
    return u'{:02d}:{:02d}.{:02d}'.format(minute, second, milisecond)

Each div has an id such cable_24 or cable_25. In an interval callback function, I want to update the background color of an element, for example div with ID cable_24.
How can I do?

It is not necessary to change it in a callback. I would also like to change background in another function (not callback)

Thanks.

2

I believe you will need to have that property of the Div you are intending to change as the output of a callback.

If you are not able to have the HTML elements assigned to their own static outputs because they are dynamically generated, then you could have them be the children of another Div element and just output that entire Div each time any one is updated.