Append content inside UL with list item and anchor tag <li><a></a></li>

Question

How to append content to UL with LIST ITEM and ANCHOR TAG inside it using Javascript? At the moment I am doing this.

    for( var i = 0; i < projects.length; i++) {
    $('<li><a href="#"></a></li>', {
        text: projects[i].author
    }).appendTo('#contributors');
}

I can get it to work if I only use <li></li> but as soon as I add anchor tags <li><a href="#"></a></li> the code does not give a desired result. What would be your solution tot his?

Answer 1

Note that the a element is being created, so that the text and href attributes are applied to it. Then it's wrapped in an li, and using parent() to grab that li, is appended to the #contributors element.

for (var i = 0; i < projects.length; i++) {
    $('<a />', {
        href: '#',
        text: projects[i].author
    }).wrap('<li />').parent().appendTo('#contributors');
}