Horizontal navigation bar drop-down and moving horizontal - html

Question

So I have a horizontal navigation bar on a page. I'm not very good (read: beginner) with code so I pieced it together from tips and tricks I found across the web. What I want to add is a code to make a vertical subsection create a another vertical subsection but next to it when hovered on. Here's what I have:
HTML:
<div id="wrap">
<ul class="navbar">
<li> Class Schedules
<ul>
<li> 2015
<li> 2015 Fall </li>
<li> 2015 Spring </li>
2014 ... etc
CSS:
#wrap {
width: 100%;
height: 50px;
margin: 0em;
z-index: 99;
position: fixed;
top: 0px;
background-color: #4d4d4d;
}
.navbar {
height: 50px;
padding: 0;
margin: auto;
position: absolute;
border-right: 1.5px solid #e68a00;
border-left: 1.5px solid #e68a00;
}
.navbar li {
height: auto;
width: 200px;
float: left;
text-align: center;
list-style: none;
font: normal bold 12px/1.2em Arial, Verdana, Helvetica;
padding: 0;
margin: 0;
background-color: #4d4d4d;
}
.navbar a {
padding: 18px 0;
border-left: 1px solid #ffa11a;
border-right: 1px solid #e68a00;
text-decoration: none;
color: white;
display: block;
}
.navbar li:hover, a:hover {background-color: #999999;}
.navbar li ul {
display: none;
height: auto;
margin: 0;
padding: 0;
}
.navbar li:hover ul {
display: block;
}
.navbar li ul li {
background-color: #4d4d4d;
}
.navbar li ul li a {
border-left: 1px solid #e68a00;
border-right: 1px solid #e68a00;
border-top: 1px solid #ffa11a;
border-bottom: 1px solid #e68a00;
}
.navbar li ul li a:hover {background-color: #999999;}
}
With what I have, when mousing over "class schedules", a drop down containing "2015", "fall 2015", "spring 2015" appears. What I want it to do I drop down to just "2015" and when you mouse on 2015, it pops over and down to "fall 2015" and "spring 2015". I've messed with the CSS trying to have ".navbar li ul li" etc be hidden until hover but I can't get it to work. I'm not sure what I need to change/add to make this happen.

Answer 1

The trick is this:
.navbar li:hover > ul {display: block;}
because .navbar is a class selector not an element selector.