Добавьте элемент DOM между двумя дочерними элементами

Я хочу добавить элемент dom между двумя дочерними элементами, особенно непосредственно перед последним.

<div id='parent'>
    <div class='nav-option'></div>
    <div class='nav-option'></div>
    <div class='nav-option'></div>
    {{I want to insert something here}}
    <div class='nav-option'></div>
</div>

Прямо сейчас я использую следующий код: 

$('#add-account').click(function(event){                               
    $('#face').append('<div class="nav-select"></div>');
});
Но, увы, это добавляет элемент в конце.
4 4
javascript jquery dom-manipulation

4 ответа:

Попробуйте это:

$('div.nav-option:last')
    .before('<div class="nav-select"></div>');

Проверьте это, чтобы прочитать больше:

2

Проверьте insertAfter () или insertBefore()

1

Jquery имеет .insertBefore и .insertAfter, которые оба делают то, что вы хотите.

0

Попробуйте 

$('.nav-option:last').before('<div class="nav-select"></div>');
0