Javascript 一种使用jquery预先编写html的方法可行，但为什么另一种方法不行'；T

这种预先结束的方式对我来说确实有效：

    <script type="text/javascript" charset="utf-8">
        $(document).ready(function() {
            $("#learn-more-button").click(function() {
                $("#main-text").load('ajax/learn-more.html #learn-more', function() {
                                            $(this).prepend('<p> DARN </p>'); // <=== This here WORKS
                    $(this).hide().fadeIn(500); //Fade in
                    $("#main-text").animate({ // Then Animate
                        width:"500px",
                        left:'+=400px',}, 
                        400
                    );                                                                  
                });                 
            });
        });
    </script>

   <script type="text/javascript" charset="utf-8">
        $(document).ready(function() {
            $("#learn-more-button").click(function() {
                $("#main-text").prepend('<p> DARN </p>'); // <=== This here doesn't work
                $("#main-text").load('ajax/learn-more.html #learn-more', function() {
                    $(this).hide().fadeIn(500); //Fade in
                    $("#main-text").animate({ // Then Animate
                        width:"500px",
                        left:'+=400px',}, 
                        400
                    );                                                                  
                });                 
            });
        });
    </script>

$（文档）.ready（函数（）{
$（“#了解更多按钮”）。单击（函数（）{
$（“#main text”）.load（'ajax/learn-more.html#learn more'，function（）{
$（this）.prepend（“DARN
”）；//当您执行
load（）
时，
#主文本
元素的内容被完全替换。因此，如果您在
加载
之前添加
DARN
，就像在第二种方法中一样，它会被覆盖

在第一种方法中，
被添加到加载的回调函数中。这是在加载完成后调用的

您还应该将方法链接到一个选择器上以获得更好的性能，如下所示：

<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
        $("#learn-more-button").click(function() {
            $("#main-text").load('ajax/learn-more.html #learn-more', function() {
                $(this).prepend('<p> DARN </p>')
                    .hide().fadeIn(500)
                    .animate({
                        width:"500px",
                        left:'+=400px'
                    }, 400);
            });                 
        });
    });
</script>


$（文档）.ready（函数（）{
$（“#了解更多按钮”）。单击（函数（）{
$（“#main text”）.load（'ajax/learn-more.html#learn more'，function（）{
$（此）.prepend（“DARN
”）
.hide（）.fadeIn（500）
.制作动画({
宽度：“500px”，
左：'+=400px'
}, 400);
});                 
});
});
你能比“不起作用”更具体一些吗？它是怎么起作用的？你有错误吗？它在错误的地方添加了
元素吗？另外，你能在问题中包含这个jQuery工作的HTML吗？所以它被添加，然后被替换。