diff --git a/src/main/webapp/js/goatControllers.js b/src/main/webapp/js/goatControllers.js
index 56c705097..2cb5ea69f 100644
--- a/src/main/webapp/js/goatControllers.js
+++ b/src/main/webapp/js/goatControllers.js
@@ -13,11 +13,11 @@ var goatMenu = function($scope, $http, $modal, $log, $templateCache) {
 		var menuItems = goat.utils.addMenuClasses(goatConstants.menuPrefix.concat(menuData.data));
 		//top-tier 'categories'
 		for (var i=0;i<menuItems.length;i++) {
-		    menuItems[i].id = menuItems[i].name.replace(/\s|\(|\)/g,'');//TODO move the replace routine into util function
+		    menuItems[i].id = goat.utils.makeId(menuItems[i].name);//TODO move the replace routine into util function
 		    menuItems[i].displayClass= ($scope.openMenu === menuItems[i].id) ? goatConstants.keepOpenClass : '';
 		    if (menuItems[i].children) {
 			for (var j=0;j<menuItems[i].children.length;j++){
-			    menuItems[i].children[j].id = menuItems[i].children[j].name.replace(/\s|\(|\)/g,'');
+			    menuItems[i].children[j].id = goat.utils.makeId(menuItems[i].children[j].name);
 			    //handle selected Menu state
 			    if (menuItems[i].children[j].id === $scope.curMenuItemSelected) {
 				menuItems[i].children[j].selectedClass = goatConstants.selectedMenuClass;
@@ -32,7 +32,8 @@ var goatMenu = function($scope, $http, $modal, $log, $templateCache) {
 			    if (menuItems[i].children[j].children) {
 				for (var k=0;k < menuItems[i].children[j].children.length;k++) {
 				    //TODO make utility function for name >> id
-				    menuItems[i].children[j].children[k].id = menuItems[i].children[j].children[k].name.replace(/\s|\(|\)/g,'');
+				    menuItems[i].children[j].children[k].id = goat.utils.makeId(menuItems[i].children[j].children[k].name);
+				    //menuItems[i].children[j].children[k].id = menuItems[i].children[j].children[k].name.replace(/\s|\(|\)/g,'');
 				    //handle selected Menu state
 				    if (menuItems[i].children[j].children[k].id === $scope.curMenuItemSelected) {
 					menuItems[i].children[j].children[k].selectedClass = goatConstants.selectedMenuClass;
diff --git a/src/main/webapp/js/goatUtil.js b/src/main/webapp/js/goatUtil.js
index fc07803f8..e8a551fb6 100644
--- a/src/main/webapp/js/goatUtil.js
+++ b/src/main/webapp/js/goatUtil.js
@@ -87,6 +87,9 @@ goat.utils = {
 	$('ul li.selected a.selected').removeClass(goatConstants.selectedMenuClass)
 	$('#'+id).addClass(goatConstants.selectedMenuClass);
 	$('#'+id).parent().addClass(goatConstants.selectedMenuClass);
+    },
+    makeId: function (lessonName) {
+        return lessonName.replace(/\s|\(|\)|\!|\:|\;|\@|\#|\$|\%|\^|\&|\*/g,'');//TODO move the replace routine into util function
     }
 };