How to pause execution of javascript till jquery fade finishes
<p>I want to do something like this</p>

<ol>
<li>Fadein a div that covers some other div</li>
<li>change contents of that some other div</li>
<li>fadeout covering div and reveal that some other div below it.</li>
</ol>

<p>Here is a code for that:</p>

<pre><code>$pH('#coveringDiv').fadeIn(300);
//want to start doing something now, but only after above fadeIn finishes
adContainer = $pH(currAdBubble).find('.mcc');
$pH(adContainer).empty().html("some html");
$pH('.phAdScroller').attr('kw',keyword);
setTimeout("$pH('#coveringDiv').fadeOut(500);",300);
</code></pre>

<p>but what happens is, <code>fadeIn</code> and code written after that start together. i want code below fadeIn to start only after <code>fadeIn</code> finishes. I tried an empty <code>setTimeout</code>, but that didn't help as well. It would be too weird to put that code in a function and call it in <code>setTimeout()</code> as there will be a need to pass many arguments to that function. So how to achieve this ?</p>
