Html mouseup caching an element more than once
<p>I've written a jquery script which works fine, but now I'm trying to make it into a plugin. Once it's in the plugin though, the mouseup function on the html appears to increase the cache of the same element by one every time, and I can't figure out why.</p>

<pre><code>    &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
    &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
    &lt;head&gt;
    &lt;title&gt;Untitled Document&lt;/title&gt;
    &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /&gt;
    &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;div class="box"&gt;Box 1&lt;/div&gt;
    &lt;script type="text/javascript"&gt;
    //&lt;![CDATA[  

    $(function(){  

              (function($) {  

              $.fn.myPlugin = function() {  

                    return this.each(function(){  

                        var $this = $(this);  

                                               $('html').mouseup(function(){            

console.log('cached +1: ' +   $this);//this ouput increases by one every mouseup                                    

                                });//html mouseup  


                            console.log('cached once: ' + $this);// this output displays once per mouseup   


                      });// return this each  


                  } //fn myPlugin  

              })(jQuery);  


    $('.box').mousedown(function(){  

        $(this).myPlugin();  

        });//.box mousedown  


    });//document ready    

    //]]&gt;
    &lt;/script&gt;
    &lt;/body&gt;
    &lt;/html&gt;
</code></pre>

<p>If someone could explain why this is happening (in as much layman's terms as possible), I'd be very grateful.</p>

<p>Thanks</p>
