jQuery fade in a div function for a specific slide on canvas (using js)
<p>jQuery fade in for a specific div function for a specific slide on canvas with a set time to .fadeIn().</p>

<p>Need div="fade" to appear once I arrive at the sixth slide in my canvas web app (based on reveal.js - <a href="http://lab.hakim.se/reveal-js/#/" rel="nofollow">http://lab.hakim.se/reveal-js/#/</a>). </p>

<p>The jQuery function works perfectly when div="fade" is put within the first  area, but if it is placed within any other section), by then of course the page onLoad happened a long time previously (which is when div id="fade" is set to load the div per:</p>

<p>jQuery:</p>

<pre><code>$(function(){  // $(document).ready shorthand
  $('#fade').fadeIn(2200);
});
</code></pre>

<p>HTML5 Section #6 (want div="fade" to work inside here):</p>

<pre><code>...
&lt;/section&gt;
&lt;!-- end section 5 --&gt;

&lt;!-- begin section 6 --&gt;
&lt;section&gt;
&lt;div&gt;
&lt;p&gt;
&lt;a href="#"&gt;Interviewing a Co-founder&lt;br&gt;
&lt;img src="img/misc/..." width="60" height="50" /&gt;
&lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt;

&lt;div id="fade" style="display:none;"&gt;
&lt;div id="browsers"&gt;
&lt;p&gt;
&lt;a href="#" target="_blank"&gt;Fundraising&lt;br /&gt;Campaign&lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt; &lt;!-- END fundraising 'browsers' --&gt;
&lt;/div&gt; &lt;!-- END fade jQuery --&gt; 
&lt;/section&gt;
&lt;!-- end section 6 --&gt;
</code></pre>

<p>...just as a side note, or for those who are unfamiliar with this canvas, each  +  + ... marks the next 'slide' when you arrow-over using the app... again, you can see example at: <a href="http://lab.hakim.se/reveal-js/#/" rel="nofollow">http://lab.hakim.se/reveal-js/#/</a>.</p>

<p>I am happy to work with a fix using good old-fashioned js or jquery.</p>
