CODEWITHSUNDEEP
jquery
Vamshi P
Vamshi P

Reputation: 23

JQuery insertAfter parent div

Below is my 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");

Here I am inserting the element after main_bg div, but I need to insert after the parent div of main_bg div. How can I do that??

Upvotes: 0

Views: 2378

Answers (3)

Muthu
Muthu

Reputation: 431

Use this below code

$(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>

Upvotes: 1

Roxoradev
Roxoradev

Reputation: 893

You can get the parent of the parent or you can use .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>

Upvotes: 0

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

You can use the .after() method for that

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

Upvotes: 4

Related Questions