button.js

var btn_evalTable = document.getElementById("btn_evalTable");
var btn_about = document.getElementById("btn_about");
var btn_plot = document.getElementById("btn_plot");
var btn_submit = document.getElementById("btn_submit");
var btn_more = document.getElementById("btn_more");

var sec_evalTable = document.getElementById("sec_evalTable");
var sec_about = document.getElementById("sec_about");
var sec_plot = document.getElementById("sec_plot")
var sec_submit = document.getElementById("sec_submit");
var sec_more = document.getElementById("sec_more");


btn_evalTable.addEventListener("click", function() {
    sec_evalTable.style.display = "block";
    sec_plot.style.display = "none";
    sec_about.style.display = "none";
    sec_submit.style.display = "none";
    sec_more.style.display = "none";

    btn_evalTable.style.color = "#000000";
    btn_plot.style.color = "#7c7b7b";
    btn_about.style.color = "#7c7b7b";
    btn_submit.style.color = "#7c7b7b";
    btn_more.style.color = "#7c7b7b";


});
btn_about.addEventListener("click", function() {
    sec_evalTable.style.display = "none";
    sec_plot.style.display = "none";
    sec_about.style.display = "block";
    sec_submit.style.display = "none";
    sec_more.style.display = "none";


    btn_evalTable.style.color = "#7c7b7b";
    btn_plot.style.color = "#7c7b7b";
    btn_about.style.color = "#000000";
    btn_submit.style.color = "#7c7b7b";
    btn_more.style.color = "#7c7b7b";


});

btn_plot.addEventListener("click", function() {
    sec_evalTable.style.display = "none";
    sec_plot.style.display = "block";
    sec_about.style.display = "none";
    sec_submit.style.display = "none";
    sec_more.style.display = "none";


    btn_evalTable.style.color = "#7c7b7b";
    btn_plot.style.color = "#000000";
    btn_about.style.color = "#7c7b7b";
    btn_submit.style.color = "#7c7b7b";
    btn_more.style.color = "#7c7b7b";

});

btn_submit.addEventListener("click", function() {
    sec_evalTable.style.display = "none";
    sec_plot.style.display = "none";
    sec_about.style.display = "none";
    sec_submit.style.display = "block";
    sec_more.style.display = "none";

    btn_evalTable.style.color = "#7c7b7b";
    btn_plot.style.color = "#7c7b7b";
    btn_about.style.color = "#7c7b7b";
    btn_submit.style.color = "#000000";
    btn_more.style.color = "#7c7b7b";

});

btn_more.addEventListener("click", function() {
    sec_evalTable.style.display = "none";
    sec_plot.style.display = "none";
    sec_about.style.display = "none";
    sec_submit.style.display = "none";
    sec_more.style.display = "block";

    btn_evalTable.style.color = "#7c7b7b";
    btn_plot.style.color = "#7c7b7b";
    btn_about.style.color = "#7c7b7b";
    btn_submit.style.color = "#7c7b7b";
    btn_more.style.color = "#000000";
});