Insert after parent

Question

What type of selector do I need to insert after the parent (divouter) class test3 in the example below? Thanks.

<div class='divouter'> <div class='divinner'> <input class=test1></input> </div> </div> <div class='divouter'> <div class='divinner'> <input class=test2></input> </div> </div> <div class='divouter'> <div class='divinner'> <input class=test3></input> </div> </div> <div class='divouter'> <div class='divinner'> <input class=test4></input> </div> </div> 

Answer 1

You can use the $.after() method:

 $(".test3").closest(".divouter").after("<div>Foo</div>"); 

Or the $.insertAfter() method:

 $("<div>Foo</div>").insertAfter( $(".test3").closest(".divouter") ); 

Answer 2

 .divouter:parent 

Answer 3

I think you want the after () method:

 $('input.test3').focus(function() { $(this).closest('div.divouter').after('<div>Hi!</div>'); });