Instruções

Passo 16

Se você olhar seu HTML, o primeiro tab já está selecionado por padrão e tem um atributo aria-selected definido como "true". Quando um usuário clica em uma aba diferente, todas as abas devem primeiro ser definidas como aria-selected="false". Para isso, você pode usar o método setAttribute para alterar o atributo aria-selected de cada aba. Aqui está um exemplo de como usar o método setAttribute em uma lista de elementos div:
const divs = document.querySelectorAll("div");
divs.forEach(div => {
  div.setAttribute("class", "new-class");
});
Use um forEach na coleção tabs para percorrer cada aba e definir seu atributo aria-selected como "false". Para a função de callback, você pode usar qualquer nome de parâmetro que desejar, mas é melhor não usar tab já que ele já está sendo usado no loop externo forEach.

O que fazer:

Testes:

  • Quando o usuário clica em uma aba, todas as abas devem ter seu atributo `aria-selected` definido como `"false"`.

Preview