How do you "copy" and append one list item from one unordered list to the other by clicking on the list item using jquery?

Question

I'm currently making my own custom audio player.I don't want to use jPlayer.I want to be able to click an "li" in my web page from an "ul" an have it be appended to the playlist. Here is my code.This is just some test code.If anyone can help, that would be awesome!!

So here is the HTML:

<h2>First List</h2>
<p>Click a track below to add to 'Second List' below:</p>
<div class="first">
    <ul>
        <li id="one" class="add"><a href"#">This is a paragraph.</a></li>
        <li id"two" class="add"><a href"#">This is another paragraph.</a></li>
    </ul>
</div>

<h2>Second List</h2>
<div class="second">
    <ul>
        <li>List item 1</li>
        <li>List item 2</li>
        <li>List item 3</li>
    </ul>
</div>

and here is my js:

function updateList() {
    var self = $(this);
    var holder = self.find("li");
    var trackId = holder.attr("id");
    var trackItem = $("#"+trackId).text();

    $('.second ul').append('<li>' + '<a href"#">' + trackItem + '</a>' + '</li>');
    $('.second ul li:last').hide().slideDown();
}

// Appending the new item
$('.add a').click(function() {
    updateList();
});

Answer 1

first of all one of many possible solutions to your specific problem could look like this:

$('.add').click(function() {
    $('.second ul').append($(this).removeClass('add').unbind('click'));  
});

there are some major issues with your code. one of them is, that you are referencing this in your updateList() function (wich points to window in that case) but that differs from the this (pointing to the clicked LI) you receive in your $('.add a').click() so if you want to handle the addition in an extra function you have to pass the value of this from your click() function to the updateList().

and lastly as this is your first question to stackoverflow, you might consider using proper tags for your future questions as this question has nothing to do with audio, player or playlist. it is a simple jquery problem.

hope i helped you a little bit, and good luck on implementing your audio player