[jQuery] Text manipulation on a menu
I'm using a vertical menu and trying to add a text arrow ">" to the
menu item if it's on level 1 or 2, but not level 3. The following code
works, but it just keeps appending after each hover event. What's the
best way to do this kind of manipulation?
Thanks.
jQuery
-------------------
$("ul.nav li a").hover(function() {
$(this).append(" 〉");
});
HTML
--------------------
<ul class="nav">
<li><a href="#">Level 1</a>
<ul>
<li>
<a href="#">Level 2</a>
<ul>
<li><a href="#">Level 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>