JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" id="btnAlunos" value="Alunos" onclick="alunos()" />

JavaScript

function aluno() {
    alert("Eu sou um aluno");
}

function professor() {
    alert("Agora eu sou professor");
}
document.getElementById("btnAlunos").onclick = function() {
    var btnAlunos = document.getElementById("btnAlunos");
    btnAlunos.value = "Professor";
    btnAlunos.setAttribute('onclick', "professor()");
    btnAlunos.id = "btnProfessor";
    aluno();
};
/*
O elemento ainda não existe aqui...
document.getElementById("btnProfessor").onclick = function() {
    professor();
};
*/