clicking on newly added links don't execute javascript function
<p>while experimenting with jquery, I created this html and javascript.</p>

<pre><code>&lt;body&gt;
&lt;div id="results"&gt;
&lt;div class="mylinkdiv"&gt;
&lt;a class="mylinkclass" href="#"&gt;8&lt;/a&gt;
: This is supposed to be a toaster.
&lt;br&gt;
&lt;a class="mylinkclass" href="#"&gt;14&lt;/a&gt;
: with a toaster maybe.
&lt;br&gt;
&lt;a class="mylinkclass" href="#"&gt;51&lt;/a&gt;
: If we're really creative.
&lt;br&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;button id="remove" type="button" &gt; Remove&lt;/button&gt;
&lt;button id="add" type="button" &gt; Add&lt;/button&gt;

&lt;/body&gt;
</code></pre>

<p>the javascript has a function to popup a message containing the link text.It also has a function to add some links to the div .A function named remove which removes the inner div .</p>

<pre><code>$(document).ready(function(){
    $('.mylinkclass').click(function(){
           getLinkText(this);
        });

    $('#remove').click(function(){
           removeContents();
        });

     $('#add').click(function(){
           addContents();
        });
});

function getLinkText(that){
    var txt = $(that).text();
    var num = parseInt(txt);
    alert('num='+num);
    return false;
}

function addContents(){
  $('#results').append('&lt;a class="mylinkclass" href="#"&gt;70&lt;/a&gt;  new line1 &lt;br&gt;');
  $('#results').append('&lt;a class="mylinkclass" href="#"&gt;77&lt;/a&gt; new line2&lt;br&gt;');
}

function removeContents(){
  $('.mylinkdiv').remove();      
}
</code></pre>

<p>When I click on the links in the original html page ( ie the 3 links ) ,the alert box pops up.</p>

<p>When I click the add button,it adds two new links to the  div.But,<strong>when I click on those newly added links ,the alert does not pop up!</strong></p>

<p>I can't understand why..can someone tell me?</p>
