[jQuery] JQuery Move Element to a New parent

[Ali]

Hey. Essentially I have two lists one id with available one id with
selected. When you click on an element within the available (a
checkbox) it executes a function

            $(".availableProfile").click(function(event) {
                        elementID = event.target.id;
                        elementGroup = elementID.split("__");

                        $(this).removeClass("availableProfile");
                        $(this).addClass("selectedProfile");
                        newBox = "<li>" + $(this).parent().html() + "</li>";
                        $(this).parent().remove()
                        $("#" + elementGroup[0] + "_selected").append(newBox);
                        $(this).parent().css({backgroundColor: '#ff0'});

        });

The part that fails is the last part. Even though i've deleted and re-
created it, JQuery won't pick up on the element any longer. Below is
the initial HTML

<ul id="ELM_available" style="list-style-type: none; list-style-image:
none; list-style-position: outside;">

                    <li>
                        <input type="checkbox"
class="availableProfile" value="ELM_External_Learner"
id="ELM__ELM_External_Learner" name="ELM_checked"/>
                        ELM External Learner
                    </li>
                </ul>
<ul id="ELM_selected"><li>
                </ul>

Here is what occurs after clicking on the checkbox.

<ul id="ELM_available" style="list-style-type: none; list-style-image:
none; list-style-position: outside;">
</ul>

<ul id="ELM_selected"><li>
                        <input type="checkbox" class="selectedProfile"
value="ELM_External_Learner" id="ELM__ELM_External_Learner"
name="ELM_checked"/>
                        ELM External Learner
                    </li></ul>

Am I doing osmething wrong or do I need to reinit?

Thanks