Menú desplegable jQuery en javascript simple - javascript, jquery, toggle

Estoy buscando ayuda para cambiar mi menú de navegación de jquery a JavaScript simple. He leído muchas preguntas sobre la conversión de jquery a javascript pero no puedo entender los cambios.

Básicamente, jquery alterna las clases para que el menú desplegable muestre y oculte,

Aquí está mi jQuery

$(document).ready(function() {

$(".three-lines-menu").on("click", function(e){

e.preventDefault();
$(".js-menu").toggleClass("js-menu-responsive");

});
});

Aquí es donde estoy con mi javascript simple

document.addEventListener("DOMContentLoaded", function(event) {

var menu = document.getElementByClassName("js-menu"),

toggleClass = function (el, cl) {
hasClass(el, cl) ? removeClass(el, cl) : addClass(el, cl);

toggleClass(menu, "js-menu-responsive");

};
};

Este es solo mi intento de leer artículos, pero no puedo hacer que funcione, cualquier consejo o un empujón en la dirección correcta sería genial.

* Nota: no necesito soporte para, por ejemplo, 6,7,8

Aquí está mi js fiddle

Respuestas

No estoy seguro de qué es exactamente lo que quieres, pero si estás buscando un menú desplegable usando JavaScript simple, prueba este enlace: jsfiddle / javascript-dropdown

    var clk = document.getElementById("clk");
clk.onclick = function() {
var hid = document.getElementById("hidden");
if (hid.classList.contains("hide")) {
hid.classList.remove("hide");
hid.classList.add("show");
} else {
hid.classList.add("hide");
hid.classList.remove("show");
}
}

document.getElementById("under").onclick = function() {
document.getElementById("parent").innerHTML = "Undergraduate";
if (document.getElementById("hidden").classList.contains("hide")) {
document.getElementById("hidden").classList.remove("hide");
document.getElementById("hidden").classList.add("show");
} else {
document.getElementById("hidden").classList.add("hide");
document.getElementById("hidden").classList.remove("show");
}
}
document.getElementById("grad").onclick = function() {
document.getElementById("parent").innerHTML = "Graduate";
if (document.getElementById("hidden").classList.contains("hide")) {
document.getElementById("hidden").classList.remove("hide");
document.getElementById("hidden").classList.add("show");
} else {
document.getElementById("hidden").classList.add("hide");
document.getElementById("hidden").classList.remove("show");
}
}