CodePen Embed - Vqydje

<ul class="main">
	<li id="menu-item-1" class="menu-item menu-item-has-children menu-item-1"><p>Parent</p>
		<ul class="sub-menu">
			<li id="menu-item-2" class="menu-item menu-item-2"><p>Children 1</p></li>
			<li id="menu-item-3" class="menu-item menu-item-3"><p>Children 2</p></li>
			<li id="menu-item-4" class="menu-item menu-item-4"><p>Children 3</p></li>
			<li id="menu-item-5" class="menu-item menu-item-has-children menu-item-5"><p>Children 4 + Sub menu</p>
				<ul class="sub-menu">
					<li id="menu-item-6" class="menu-item menu-item-6"><p>Sub menu children 1</p></li>
					<li id="menu-item-7" class="menu-item menu-item-has-children menu-item-7"><p>Sub menu children 2 + sub menu</p>
						<ul class="sub-menu">
							<li id="menu-item-8" class="menu-item menu-item-8"><p>Sub menu children 1</p></li>
						</ul>
					</li>
				</ul>
			</li>
			<li id="menu-item-9" class="menu-item menu-item-9"><p>Children 5</p></li>
			<li id="menu-item-10" class="menu-item menu-item-10"><p>Children 6</p></li>
		</ul>
	</li>
</ul>

.menu-item-has-children > p:after
{
	content: ' [>]';
}
.sub-menu .menu-item-has-children > p:after
{
	content: ' [»]';
}

This Pen is owned by UnluckySerivelha on CodePen. It is a fork of this Pen.

See more by @UnluckySerivelha on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.