Need to add an <li> at the end of each ul on a page

Question

I need to be able to add an <li> </li> to each UL within a certain div on my page. Here is the code I have:

<div class="sfmg-thumbs-wrapper" style="width: 67px;">
<ul>
<li class="active"><a href="#"><img width="20" height="20" alt="Photo Title Here 1" src="images/temp/portfolioImage1.jpg"></a></li> 
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 2" src="images/temp/portfolioImage2.jpg"></a></li>
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 3" src="images/temp/portfolioImage3.jpg"></a></li>
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 4" src="images/temp/portfolioImage4.jpg"></a></li>
</ul>
</div>

<div class="sfmg-thumbs-wrapper" style="width: 67px;">
<ul>
<li class="active"><a href="#"><img width="20" height="20" alt="Photo Title Here 1" src="images/temp/portfolioImage1.jpg"></a></li> 
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 2" src="images/temp/portfolioImage2.jpg"></a></li>
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 3" src="images/temp/portfolioImage3.jpg"></a></li>
<li class=""><a href="#"><img width="20" height="20" alt="Photo Title Here 4" src="images/temp/portfolioImage4.jpg"></a></li>
</ul>
</div>

I need to insert a LI tag to the end of each div. Here is the jquery I was using:

$('.sfmg-thumbs-wrapper').each(function() {
$('.sfmg-thumbs-wrapper').find('.sfmg-thumbs-wrapper li:last').appendTo('<li class="info"/>');
});

This is not working. Thanks in advance for any help!

Answer 1

Try $('.sfmg-thumbs-wrapper ul').append('<li class="info"/>');

Answer 2

Use append():

$('.sfmg-thumbs-wrapper ul').append('<li class="info"/>');

With appendTo it would be vice versa:

$('<li class="info"/>').appendTo('.sfmg-thumbs-wrapper ul');

Answer 3

Did you try just this (no each needed)?

$('.sfmg-thumbs-wrapper ul').append('<li class="info"/>')

Answer 4

I think, and I am sure I will be corrected on this, if you wanted your code to work as it was you should have done this:

$('.sfmg-thumbs-wrapper').each(function() {
    $(this).find('li:last').appendTo('<li class="info"/>');
});

But as other said, thats not a good way to do things. Try to avoid looping it you can.