Append a div to a link in nested list using jquery

I'm using a list like this

<ul class="menu"> 
<li><a>Test Page</a></li>
<li><a>Test Page</a></li>
<li><a>Test Page</a>
    <ul>
    <li><a>Test Page</a></li>
    <li><a>Test Page</a></li>
    <li><a>Test Page</a></li>
    <li><a>Test Page</a></li>
    </ul>
</li>
<li><a>Test Page</a></li>
</ul>

I need to append <div class"arw"></div> to the <a> that is followed by a nested <ul> so in the example above it would be here

<ul class="menu">
<li><a>Test Page</a></li>
<li><a>Test Page</a></li>
<li><a>Test Page<div class="arw"></div></a>
    <ul>
    <li><a>Test Page</a></li>
    <li><a>Test Page</a></li>
    <li><a>Test Page</a><开发者_如何学C/li>
    <li><a>Test Page</a></li>
    </ul>
</li>
<li><a>Test Page</a></li>
</ul>

Not sure, the jquery would look something like this:

$('.menu li:has(ul)').prev('a').append('<div class="arw"></div>');

---

If there will alwyas only be 1 <a> tag that is a direct child each <li> you could use this

$('.menu li:has(ul) > a').append('<div class="arw"></div>');

---

$('.menu li:has(ul)').find('a:first').append('<div class="arw"></div>');

need .find() instead.

Or better yet

$('.menu li:has(ul) a:first').append('<div class="arw"></div>');

---

$('.menu li:has(ul) > a').append('<div class="arw">te</div>');

live: http://jsfiddle.net/Q6xEh/