append(content):为所有匹配的元素的内部追加内容（在被选元素的结尾插入内容）
示例：
<body> <script type="text/javascript"> //入口函数 $(document).ready(function(){ // 创建文本节点 var $jsp = $("<h1>hello world</h1>") //插入 $("#box").append($jsp) }) </script> <div id="box"></div> </body>
输出：
appendTo(content):将所有匹配的元素添加到另一个元素集合中（在被选元素的结尾插入内容）
<body> <script type="text/javascript"> //入口函数 $(document).ready(function(){ // 创建文本节点 var $jsp = $("<h1>hello world</h1>") //插入 $jsp.appendTo("#box") }) </script> <div id="box"></div> </body>
输出：
prepend(content):在被选元素的开头插入内容
示例：
<body> <script type="text/javascript"> //入口函数 $(document).ready(function(){ // 创建文本节点 var $jsp = $("<h1>hello world</h1>") //插入 $("#box").prepend($jsp) }) </script> <div id="box">123</div> </body>
输出：
prependTo(content):将所有匹配的元素插入到另一个元素集合中的开头
示例：
<body> <script type="text/javascript"> //入口函数 $(document).ready(function(){ // 创建文本节点 var $jsp = $("<h1>hello world</h1>") //插入 $jsp.prependTo($("#box")) }) </script> <div id="box">123</div> </body>
输出：
jQuery对DOM节点进行操作(插入节点之在元素内部插入)
原文：https://www.cnblogs.com/abner-pan/p/12856945.html