title: jQuery - Accessing object properties from within another object that was passed to an event
body: <p><a href="https://stackoverflow.com/questions/2355550/jquery-how-do-you-store-and-access-an-object-within-another-object">In an earlier question</a> I worked out how to store an <code>object</code> as <code>properties</code>.
  Now I am trying to access those <code>properties</code> when the <code>object</code> is passed through an event but can't get it to work:</p>
  
  <pre><code>&lt;script language="javascript"&gt;
  $(document).ready(function() {
      //create a TestObject
      function TestObject() {
        this.testProperty = "green";
      }
  
      //and an instance of it
      var testObject = new TestObject();
  
      //attach this instance to the div as a property
      var test;
      test = $('#test');//the div
      jQuery.data(test, "obj", testObject);
  
      //prove it worked and the TestObject is assigned
      alert(jQuery.data(test, "obj").testProperty);//works
  
      $('#test').click(TestClick);
      //test.click(TestClick); doesn't work either
  
      function TestClick() {
          alert($(this).attr("id"));//displays "test" - works
          alert(jQuery.data($(this), "obj").testProperty);
          //testProperty is null or not an object??
          //clearly TestObject is no longer attached to the div, why?
          //Or have I attached it the wrong way?    
          //alert(jQuery.data(this, "obj").testProperty); doesn't work either
      };
  });
  &lt;/script&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
          &lt;div id="test"&gt;Here is a test div&lt;/div&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  </code></pre>