CSS showing and hiding childs and parents

[devila]

I have 3 levels of lists. I want just that li's options box to show. Not any child's options and not any parent's options box. Currently when I walk down the tree, the parent stays hovered which makes sense but is not what I want. How do I do this?http://jsfiddle.net/tGQUa/3/HTML\[code\]<ul class="firstLevel"><li> <label>Test 1</label> <div class="options"> <a href="">Delete</a> <a href="">Add</a> </div> <ul class="secondLevel"> <li> <label>Test 2</label> <div class="options"> <a href="">Delete</a> <a href="">Add</a> </div> <ul class="thirdLevel"> <li> <label>Test 3</label> <div class="options"> <a href="">Delete</a> <a href="">Add</a> </div> </li> </ul> </li> </ul></li>\[/code\]?CSS\[code\]ul.secondLevel {margin-left:15px;}ul.thirdLevel {margin-left:15px;}ul.firstLevel li .options{ display: none;}ul.firstLevel li:first-child:hover > .options{ display: inline-block;}ul.secondLevel li .options{ display: none;}ul.secondLevel li:first-child:hover > .options{ display: inline-block;}ul.thirdLevel li .options{ display: none;}ul.thirdLevel li:first-child:hover > .options{ display: inline-block;}.options { display: inline; font-size: 10px; font-weight: normal;}\[/code\]