jQuery, where to load functions best practice
<p>I am using jQuery and I am loading dynamic HTML via PHP.  My question is, what is the best practice concerning elements/attributes that may or may not exist on any given page?  Should I have one .js file containing all the possibilities (I would think this is inefficient) or should I use a bunch of script tags (that seems also inefficient)?  Is there a "lazy" initialization way to do this?</p>

<p>For instance, say I have the following:</p>

<pre><code>&lt;div id="list"&gt;
   &lt;ul&gt;
      &lt;li&gt;some&lt;/li&gt;
      &lt;li&gt;stuff&lt;/li&gt;
      &lt;li&gt;here&lt;/li&gt;
   &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>But this list is generated only if necessary, not on all pages.  Should my global js file have the following:</p>

<pre><code>$("#list").click( function(){ 
   $(this).removeClass('collapse').addClass('expand'); 
});
</code></pre>

<p>Or should I add it in a script tag <del>just above the div that is being generated</del> at the bottom of the page after creating the div is output via PHP?</p>

<p>Thanks SO, you guys are awesome.  Can't wait until I know enough to start answering some questions!</p>

<p>Edit, just thought of a quick way to ask.  Which is better, jQuery running with a bunch of selectors that don't match or passing javascript in script tags via PHP?</p>
