Javascript 预加载显示/隐藏div

有人知道一个简单的表演吗？我得到了该节目div下面的代码的帮助。它工作正常，但我需要在页面加载时预加载第一个链接Sci Lit 1。有人告诉我需要准备一份文件。我不知道该怎么补充

    <div id="sclit"></div>

    <a href="javascript:void(0)" class="para">Sci Lit 1</a>
    <div class="details">text for sci lit 1</div> 
    <a href="javascript:void(0)" class="para">Sci Lit 2</a>
    <div class="details">text for sci lit 2</div>    
    <a href="javascript:void(0)" class="para">Sci Lit 3</a>
    <div class="details">text for sci lit 3</div>   

    $(function(){
        $(".para").click(function(){
            $("#sclit").text($(this).next(".details").text()); 
        });
    });
<style>
.details {display:none;}
</style>

sci lit 1的文本
sci lit 2的文本
sci lit 3的文本
$（函数（）{
$（“.para”）。单击（函数（）{
$（“#sclit”）.text（$（this）.next（“.details”）.text（））；
});
});
.details{显示：无；}

只是一个猜测：

$("#sclit").text($("div.details:first").text());

将其添加到加载页面时运行的$（函数（）{…}）中

如果我对问题的理解正确，似乎有效： 只是一个猜测：

$("#sclit").text($("div.details:first").text());

将其添加到加载页面时运行的$（函数（）{…}）中

如果我对问题的理解正确，似乎有效：

添加此行：

$(".details:first").clone().appendTo("#sclit").show();

演示：

还有其他方法可以做到这一点，但这应该可以做到。

添加这一行：

$(".details:first").clone().appendTo("#sclit").show();

演示：

---

还有其他方法，但这应该可以。

小建议：

sclit

在教育网站上使用ID名称可能不是一个好选择。谢谢，我会改变它。@jnpcl:可能在性教育网站上。@Wesley:+1互联网积分给你，先生！小建议：

sclit

在教育网站上使用ID名称可能不是一个很好的选择。谢谢，我会改变它。@jnpcl:可能在性教育网站上。@Wesley:+1互联网积分给你，先生！嘿，这也行+1与您的（IMO更好）版本和OP的代码嘿，这也工作+1使用您的（IMO更好）版本和OP代码