如何使用jQuery将HTML添加到div元素

时间:2017-03-23 05:56:13

标签: javascript jquery html wordpress wordpress-theming

<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

<script type="text/javascript">
  jQuery(document).ready(function () {
    jQuery('<i class="fa fa-arrow-up"></i>').insertAfter('.section-inner');
 });
</script>

以上代码我尝试了但是它无法正常工作任何人都可以帮我解决这个问题。

感谢

4 个答案:

答案 0 :(得分:0)

.insertAfter可以正常使用文字,确保您已添加

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>到您的文件。

jQuery('<i class="fa fa-arrow-up" aria-hidden="true"></i>').insertAfter('.section-inner');
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

答案 1 :(得分:0)

替换 <i class="fa fa-arrow-up" <i class="fa fa-arrow-up"> </i>

jQuery(document).ready(function(){
   
     jQuery('<i class="fa fa-arrow-up"> </i>').insertAfter(".section-inner");
   
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/>


<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

答案 2 :(得分:0)

you can use this simple method to add a div inside target area
$('.target-area').append('<div></div>');

if you want to wrap a pre existing elemnt to a tag you should use this one

$(document).ready(function(){
   $("button").click(function(){
        $("p").wrap("<div></div>");
    });
});

答案 3 :(得分:0)

.insertAfter正常工作你如何使用它,但它不适合你然后尝试如下

&#13;
&#13;
jQuery('.section').append('<i class="fa fa-arrow-up">Appended</i>');
&#13;
&#13;
&#13;

JSFiddle你可以在这里查看 - https://jsfiddle.net/181j7656/