JQuery insertAfter父目录

Question

下面是我的HTML

<div class="col-xs-12" id="docprop_00" class="docprop">                
        <div id="documentProperties" class="main_bg"></div>                 
</div>

JQuery

newElement.insertAfter("div.main_bg:last");

在这里，我在main_bg div之后插入元素，但我需要在main_bg div的父div之后插入。我该怎么做呢？？

Answer 1

为此，您可以使用.after()方法

$(".main_bg").parent().after(newELament);

Answer 2

使用下面的代码

​

$(document).ready(function(e){
  $('.addnew').click(function(e){
  $('<p>New element</p>').insertAfter('.main_bg');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="docprop">
   <div class="main_bg">
     main_bg
   </div>
</div>

<button class="addnew">Add</button>

​

Answer 3

您可以获取父对象的父对象，也可以使用.after()

​

$(".main_bg").parent().parent().append("<p>New element</p>");

.col-xs-12{
  border:1px solid black;
  }
.main_bg{
  border:1px solid black;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="col-xs-12" id="docprop_00" class="docprop">                Parent
        <div id="documentProperties" class="main_bg">Main Bg</div>                 
</div>

​