Executando verificação de segurança...
2

Tem coisa que só vem com o tempo mesmo.

Mas algo que ajuda é tentar conhecer o que já existe. Existem trocentos elementos HTML, por exemplo, cada um mais indicado para determinada situação. Percebo que hoje em dia há um certo abuso em usar sempre a mesma meia dúzia de elementos e "compensar" no JavaScript. Sendo que muitas vezes já existe um elemento que faz o que vc precisa - exemplo.

Os tutoriais da MDN ajudam bastante nesse sentido, são bem completos e atualizados.

No seu caso específico, perceba que tem muito código repetitivo: tanto no botão branco quanto no preto, a maior parte é igual, só mudando alguns detalhes. Isso é um forte indício de que poderia ser melhorado (repetição por si só nem sempre é ruim, mas geralmente indica que há espaço pra melhorias).