diff --git a/components/lib/contextmenu/ContextMenuBase.js b/components/lib/contextmenu/ContextMenuBase.js
index 2959732839..6c7cd2bdd8 100644
--- a/components/lib/contextmenu/ContextMenuBase.js
+++ b/components/lib/contextmenu/ContextMenuBase.js
@@ -65,7 +65,7 @@ const classes = {
     icon: 'p-menuitem-icon',
     submenuIcon: 'p-submenu-icon',
     label: 'p-menuitem-text',
-    separator: 'p-menu-separator',
+    separator: 'p-menuitem-separator',
     transition: 'p-contextmenu',
     submenuTransition: 'p-contextmenusub'
 };
diff --git a/components/lib/megamenu/MegaMenuBase.js b/components/lib/megamenu/MegaMenuBase.js
index 0ead487dc8..2f6202a2b5 100644
--- a/components/lib/megamenu/MegaMenuBase.js
+++ b/components/lib/megamenu/MegaMenuBase.js
@@ -9,7 +9,7 @@ const classes = {
             'p-megamenu-mobile-active': mobileActiveState
         }),
     content: 'p-menuitem-content',
-    separator: 'p-menu-separator',
+    separator: 'p-menuitem-separator',
     submenuIcon: 'p-submenu-icon',
     action: ({ item }) => classNames('p-menuitem-link', { 'p-disabled': item.disabled }),
     submenuItem: ({ focused, disabled, active }) =>
diff --git a/components/lib/menubar/MenubarBase.js b/components/lib/menubar/MenubarBase.js
index 7b9d7a93f9..3e562feff0 100644
--- a/components/lib/menubar/MenubarBase.js
+++ b/components/lib/menubar/MenubarBase.js
@@ -9,7 +9,7 @@ const classes = {
         classNames('p-menubar p-component', {
             'p-menubar-mobile-active': mobileActiveState
         }),
-    separator: 'p-menu-separator',
+    separator: 'p-menuitem-separator',
     icon: 'p-menuitem-icon',
     label: 'p-menuitem-text',
     submenuIcon: 'p-submenu-icon',
diff --git a/components/lib/panelmenu/PanelMenuBase.js b/components/lib/panelmenu/PanelMenuBase.js
index 7702c5685e..5ad0315ea2 100644
--- a/components/lib/panelmenu/PanelMenuBase.js
+++ b/components/lib/panelmenu/PanelMenuBase.js
@@ -11,7 +11,7 @@ const classes = {
     headerContent: 'p-panelmenu-header-content',
     menuContent: 'p-panelmenu-content',
     root: ({ props }) => classNames('p-panelmenu p-component', props.className),
-    separator: 'p-menu-separator',
+    separator: 'p-menuitem-separator',
     toggleableContent: ({ active }) =>
         classNames('p-toggleable-content', {
             'p-toggleable-content-collapsed': !active
diff --git a/components/lib/panelmenu/PanelMenuSub.js b/components/lib/panelmenu/PanelMenuSub.js
index 363cd6ed96..ea60c58736 100644
--- a/components/lib/panelmenu/PanelMenuSub.js
+++ b/components/lib/panelmenu/PanelMenuSub.js
@@ -253,7 +253,7 @@ export const PanelMenuSub = React.memo(
         };
 
         const createItem = (item, index) => {
-            return item.separator ? createSeparator(index) : createMenuItem(item, index);
+            return getItemProp(item, 'separator') ? createSeparator(index) : createMenuItem(item, index);
         };
 
         const createMenu = () => {
diff --git a/components/lib/tieredmenu/TieredMenuBase.js b/components/lib/tieredmenu/TieredMenuBase.js
index 2c29ee73e1..172d14fffb 100644
--- a/components/lib/tieredmenu/TieredMenuBase.js
+++ b/components/lib/tieredmenu/TieredMenuBase.js
@@ -13,7 +13,7 @@ const classes = {
             },
             props.className
         ),
-    separator: 'p-menu-separator',
+    separator: 'p-menuitem-separator',
     icon: ({ _icon }) => classNames('p-menuitem-icon', _icon),
     content: 'p-menuitem-content',
     label: 'p-menuitem-text',