<script>
function genTagId(newID) {
const all = document.getElementsByClassName('tableID');
for(let el of all) {
if (
el.id === undefined) {
el.id = newID;
console.log('Тут сгенерированный id: ' +
el.id);
}
}
}
</script>
<table class="tableID" style="width: 90%; background-color: white; margin: 0 auto;">
<tr>
<td style="font-weight: bold;">Время</td>
<td style="font-weight: bold;">Услуга</td>
<td style="font-weight: bold;">Статус времени</td>
</tr>
{% for t in arrTime %}
<tr >
<td>
{{ t }}
</td>
<td class="tableTD" >
{% for s in arrStatusTime %}
{% if s == t %}
{% for key,value in arrUslugaName.items %}
{% if key == t %}
<strong style="color: #ff1200;">{{value}} </strong>
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
{% if not arrStatusTime and not arrUslugaName %}
<strong style="color: #0d7f00;">Время свободно</strong>
{% endif %}
</td>
<script>
genTagId('{{ t }}')
</script>
<td>
<button onclick="selection('{{ t }}')" class="btn btn-success btn-sm" style="color: white;">Занять время</button>
</td>
</tr>
{% endfor %}
</table>