title: Jquery can't access original jquery objects from new div on ajx load event
body: <p>I have a page that has a bunch of JQuery objects. On that same page, I have a form where you can enter search terms in a series of fields and click on a search button, which will then send an AJAX request to the server and then load the resulting HTML into a div. A very simply Jquery application...</p>
  
  <p>The problem is this. When you click on a search result link that was loaded into the div via ajax, the Jquery code on the original page will not fire. If I add a function called searchClick() on the original page, for example, then I add an onClick="searchClick()" to each <code>&lt;a&gt;</code> tag that is loaded into the div via ajax, clicking on that link yields a JS error that says searchClick() is undefined. But it is defined! I defined it before the AJAX call. I was reading up on Jquery event bubbling but this doesn't seem like the problem. I am not sure actually but I have tried it and it still didn't work. here is my current code</p>
  
  <p><strong>on the main page that loads when the browser loads the page:</strong></p>
  
  <pre><code>&lt;script language="javascript" type="text/javascript"&gt;
  </code></pre>
  
  <p>$(document).ready(function() {</p>
  
  <p>...</p>
  
  <pre><code>    **function searchClick(value)** {
        alert("here");
      }
  
       $('#search').click(function() {
               description = urlencode($("#description").val());
               manufacturer = urlencode($("#manufacturer").val());
               product = urlencode($("#product").val());
               category = urlencode($("#category").val());
               subcategory = urlencode($("#subcategory").val());
  
               $(**'#search_results'**).**load**('/productSearch.php?description=' + description + '&amp;product=' + product + '&amp;category=' + category + '&amp;subcategory=' + subcategory')
  
         });
  
      ...
      &lt;/script&gt;
  
      &lt;div id="**search_results**"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>the following is an example of the links that appear in the search_results div when the ajax query is called (the load())</strong></p>
  
  <pre><code>&lt;a href="#" onclick="s**earchClick("some value")"**&gt;Product 1&lt;/a&gt;
  </code></pre>
  
  <p>Clicking on that link in the example above will yield a searchClick() not defined error.
  Anyone got any suggestions? Thank you!</p>