javascript - divの前に追加しますが、最初の要素の後

Question

（ボタン）の.container後に（最新の）新しい部門を追加する必要があります。.controls出来ますか？

注：ボタンの下に追加されたコントロールを保持する新しい分割を追加することは、私にとってオプションではありません。HTMLはそのままである必要があります。

フィドル： http： //jsfiddle.net/MhRmy/

Answer 1

1つのオプション：

$(document).ready(function(){
    $('.add').bind('click', function(){
        $('<div />',{class: 'new-control'})
            .insertAfter($('.container .controls'));
    });
});​

JSフィドルデモ。

そして別の：

$(document).ready(function(){
    $('.add').bind('click', function(){
        $('<div />',{class: 'new-control'})
            .appendTo($('.container'));
    });
});​

JSフィドルデモ。

参照：

• appendTo()。
• insertAfter()。

Answer 2

jQueryのafter()メソッドを使用して、特定の要素の兄弟として要素を追加します。

$(document).ready(function(){
  $('.add').bind('click', function(){
    $('.container .controls').after('<div class="new-control"></div>');
  });
});​

Answer 3

これがデモです

$(function(){
    $('.add').on('click', function(){
        $('.controls').after('<div class="new-control"></div>');
    });
});​