Search code examples
javascriptjqueryappendappendto

jQuery append div to a specific


How do I append a element a specific index of the children elements using jQuery append e.g. if I have:

<div class=".container">
   <div class="item"><div>
   <div class="item"><div>
   <div class="item"><div>
   <div class="item"><div>
</div>

and I want to append another item between the second and third item?


Solution

  • There are a few options:

    $("div.container div.item").eq(2).after($('your html'));
    
    $("div.container div.item:nth-child(3)").after($('your html'));
    
    $($("div.container div.item")[2]).after($('your html'));
    

    The same options, but inserting into the same position using "before":

    $("div.container div.item").eq(3).before($('your html'));
    
    $("div.container div.item:nth-child(4)").before($('your html'));
    
    $($("div.container div.item")[3]).before($('your html'));