Delegate/Live Failure. Can't bind events after Prepending an element
<p>EDIT--- I realized that the problem here was that the click handler that was bound to the element had to be unbound before I could bind another click handler handler. </p>

<p>I want to allow the user to select/unselect items by click on the element in question.  The elements start in an "options" box and if clicked, move to a "selected box".  If they are then clicked in the selected box, the elements move back to the original options box. </p>

<p>Can't figure out why delegate() and live() are not working here.  I assume this has to do with prependTo() or appendTo(). </p>

<pre><code>  $('#amen_options .options p').click(function(e){
      $(this).appendTo('#amen_selected .options');
      e.stopPropagation();
      e.preventDefault();
});

/*  
$("body").delegate('#amen_selected p', 'click', function(e){
    #(this).appendTo('#amen_options .options');
    e.stopPropagation();
    e.preventDefault();
});
*/
$('div#amen_selected div.options p').live('click',function(e){
    $(this).appendTo('#amen_options .options');
    e.stopPropagation();
    e.preventDefault();
});
</code></pre>

<p>Here's the markup:</p>

<pre><code>  &lt;div&gt;
   &lt;div id="amen_options"&gt;
        &lt;h3&gt;Click to Select&lt;/h3&gt;
        &lt;div class="options"&gt;
            &lt;p data-option=""&gt;One&lt;/p&gt;
            &lt;p data-option=""&gt;Two&lt;/p&gt;
            &lt;p data-option=""&gt;Etc...&lt;/p&gt;
                 &lt;/div&gt;
   &lt;/div&gt;
   &lt;div id="amen_selected"&gt; 
        &lt;h3&gt;Selected&lt;/h3&gt;
        &lt;div class="options"&gt;
        &lt;/div&gt;
   &lt;/div&gt;   
</code></pre>

<p>The first click works (sending p elements from options to selected box).  Once in selected, though, no event handlers are binding.  The firebug console isn't showing an error.  Normally, I'd assume that this is a markup problem, but I've checked it repeatedly. </p>

<p>Thanks!</p>
