[jQuery] overlay does not work in jquery ajax success

[jQuery] overlay does not work in jquery ajax success


I use jQuery Tools and got a strange problem
(jQuery Tools --> http://flowplayer.org/tools/index.html)
HTML
<code class="html">
        <button type="button" rel="#overlay" id="overlaystatic">static</
button>
        <button type="button" rel="#overlay" id="overlaydynamic">dynamic</
button>
</code>
Version where only the static overlay works
<code class="javascript">
$(document).ready(function(){
    $("#overlaystatic").overlay({expose: '#6096D4'});
    function createoverlay () {
         var datastring = "somedata";
         $.ajax({
             type: "POST",
             url: "check.php",
             data: "datastring =" + datastring ,
             success: function(msg){
                     alert(msg);
                     $("#overlaydynamic").overlay({expose: '#6096D4'});
             }
        });
    }
    createoverlay();
});
</code>
If I put the overloay code for the dynamicoverlay outside of the ajax
it works fine
<code class="javascript">
$(document).ready(function(){
    $("#overlaystatic").overlay({expose: '#6096D4'});
    function createoverlay () {
         var datastring = "somedata";
         $.ajax({
             type: "POST",
             url: "check.php",
             data: "datastring =" + datastring ,
             success: function(msg){
                     alert(msg);
             }
        });
$("#overlaydynamic").overlay({expose: '#6096D4'});
    }
    createoverlay();
});
</code>
so why the line
$("#overlaydynamic").overlay({expose: '#6096D4'});
does work in the function but not inside the jquery ajax.