JQuery click() event fires twice when called by live()
<p><a href="http://pastebin.com/1MGTtzij" rel="nofollow">http://pastebin.com/1MGTtzij</a> here is my full html document, and below is the short version:   </p>

<pre><code>    $(document).ready(function () {
        $("#myDiv").append($("&lt;input /&gt;", {
                            type : "button",
                            id : "myButton1",
                            value : "Click me first!"
                        }));
        $("#myButton1").live("click", function () {
            var a = 1;
            $("#myButton2").click(function () {
                alert(a);
            });
        });
    });
</code></pre>

<p>with the HTML code:</p>

<pre><code>    &lt;div id="myDiv"&gt;&lt;/div&gt;
    &lt;input type="button" id="myButton2" value="Click me!" /&gt;
</code></pre>

<p>After the page stoped load and fully show, you will see 2 button <strong>Click me first!</strong> and <strong>Click me!</strong>, do after me:</p>

<ol>
<li>click <strong>Click me first!</strong> - nothing happen - OK  </li>
<li>click <strong>Click me!</strong> - alert 1 - OK  </li>
<li>click <strong>Click me first!</strong> - nothing happen - OK  </li>
<li>click <strong>Click me!</strong> - alert 1 - alert 1 ?????????????<br>
So I recognized that if I click on <strong>Click me first!</strong> N times, I will get (N + 1) alerts. How can I fix that??  </li>
</ol>

<p>Thanks all of you!</p>
