Javascript for a second responsive select nav on ONE page - wordpress

Question

I'm building a responsive site that uses javascript to create a select nav for the primary navigation menu when the viewport is less than 800px wide. This select nav works as planned.
Now, I'm trying to add a SECOND responsive select nav to a couple of pages (pages that obviously include the primary navigation menu). I've duplicated the script (the script used to enable the primary navigation menu to become a select nav), and tried renaming a couple variables to get the secondary navigation menu to act responsively (similar to the primary navigation menu). The responsive select nav appears for the secondary navigation menu when the viewport goes down below 800px, however, when you select a secondary page from this menu, nothing happens. The user isn't taken to a new secondary page.
Can you help me troubleshoot this?
I tried to set up a jfiddle http://jsfiddle.net/R3AD3/
Here is the script for the primary navigation menu:
function selectnav() {
var select = document.createElement('select');
var first = document.createElement('option');
first.innerHTML = 'Main Navigation';
first.setAttribute('selected', 'selected');
select.setAttribute('id', 'mobile');
select.appendChild(first);
var nav = document.getElementById('nav');
var loadLinks = function(element, hyphen, level) {
var e = element;
var children = e.children;
for(var i = 0; i < e.children.length; ++i) {
var currentLink = children[i];
switch(currentLink.nodeName) {
case 'A':
var option = document.createElement('option');
option.innerHTML = (level++ < 1 ? '' : hyphen) + currentLink.innerHTML;
option.value = currentLink.href;
select.appendChild(option);
break;
default:
if(currentLink.nodeName === 'UL') {
(level < 2) || (hyphen += hyphen);
}
loadLinks(currentLink, hyphen, level);
break;
}
}
}
loadLinks(nav, '- ', 0);
nav.appendChild(select);
var mobile = document.getElementById('mobile');
if(mobile.addEventListener) {
mobile.addEventListener('change', function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
});
} else if(mobile.attachEvent) {
mobile.attachEvent('onchange', function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
});
} else {
mobile.onchange = function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
}
}
}
Here is the script that I duplicated... I then renamed a couple variables:
function selectnav_EP() {
var select = document.createElement('select');
var first = document.createElement('option');
first.innerHTML = 'Electric Playground Nav';
first.setAttribute('selected', 'selected');
select.setAttribute('id', 'mobile');
select.appendChild(first);
var nav = document.getElementById('nav_EP');
var loadLinks = function(element, hyphen, level) {
var e = element;
var children = e.children;
for(var i = 0; i < e.children.length; ++i) {
var currentLink = children[i];
switch(currentLink.nodeName) {
case 'A':
var option = document.createElement('option');
option.innerHTML = (level++ < 1 ? '' : hyphen) + currentLink.innerHTML;
option.value = currentLink.href;
select.appendChild(option);
break;
default:
if(currentLink.nodeName === 'UL') {
(level < 2) || (hyphen += hyphen);
}
loadLinks(currentLink, hyphen, level);
break;
}
}
}
loadLinks(nav, '- ', 0);
nav.appendChild(select);
var mobile = document.getElementById('mobile');
if(mobile.addEventListener) {
mobile.addEventListener('change', function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
});
} else if(mobile.attachEvent) {
mobile.attachEvent('onchange', function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
});
} else {
mobile.onchange = function () {
window.location.href = mobile.options[mobile.selectedIndex].value;
}
}
}
In the footer, I call upon both of these scripts.
Here is the exact page to my website
http://brianlueck.com/wordpress/electric-playground/
Narrow your browser window below 800px to see the responsive select navs appear... you'll notice that the primary navigation menu works fine, however, the secondary navigation menu doesn't function properly because it doesn't link off to the pages it should link to.
Can anyone help?