Question

I have a list of elements in a container. The elements are li which contain an a tag.

My problem is that not all of the a are inside a li tag (this is due to a previous jquery operation).

How can I iterate through the list and put the a tags that are not in a li, inside one?

Here is the html concerned:

<ul class="dropdownmenu" style="display: none; ">

<li><a href="Advanced">Advanced</a></li>
<li><a href="Account">Account</a></li>

<a href="Credit Notes">Credit Notes</a>
<a href="Invoices In">Invoices In</a>

<li><a href="Invoices Out">Invoices Out</a></li>
<li><a href="Invoices Jobs">Invoices Jobs</a></li>

</ul>

And my javascript:

$('li[id^="nav"]').each(function(){ // For each nav item that has fallen out of the menu due to low res etc...
    pos = $(this).position() ;
    if(pos.top > 0)
    {
        var cnt = $('ul.dropdownmenu', this).contents()
        $('ul.dropdownmenu', this).replaceWith(cnt);
        $('span.droptop', this).remove();
        $('a:has(i span)', this).remove() ;
        $('i', this).remove() ;
        // NOW WRAP As in LIs THAT DON'T HAVE ONE
        movables += $(this).html() ;
        $(this).hide() ;
        somethingHidden = true ;
    }
})

Answer 1

Simply wrap all a elements before running your function:

$('ul.dropdownmenu > a').wrap('<li />');