親になるには子divにする必要がありますが、jsやCSSでは可能ですか？

Question

私はこのコードを持っ例えばのでこんにちは、私は、親になるために子要素を移動する必要があります。

<div id="parent1"></div> 

<div id="parent2"> 
<div id="child1">some text in here</div> 
</div> 

私はそのようなchild1の親1の下に例えばparent2の外に移動することにしたい。

<div id="parent1"></div> 
<div id="child1">some text in here</div> 

<div id="parent2"> 

</div> 

私はページソースコードを変更してjqueryやCSS、それ以外のアイデアでそれを行う必要はありません。

おかげ

Answer 1

はこれを試してください：あなたはCSSを使ってDOMを変更することはできません

$('#child1').insertAfter('#parent1'); 

Answer 2

、あなたはそれがどのように見えるかを変更することができます。 jQueryの答えは、プレーンJSで、与えられた：

var p = document.getElementById('parent1'); 
var c = document.getElementById('child1'); 

if (p && c) { 
    // insert c as last child of p 
    p.appendChild(c); 

    // insert c as first child of p 
    p.insertBefore(c, p.firstChild); 
} 

最初のオプションをしたい場合は、1行でそれを行うことができますが、私はそれをお勧めしません：

document.getElementById('parent1').appendChild(document.getElementById('child1')); 

あなたエイリアス場合DOMのメソッドは、それはより短くすることができます。

Answer 3

あなたがこれを行うには、複数の選択肢があり、そのうちのいくつかは、fallowing-

$('#parent1').prepend($('#child1')); 
$('#child1').prependTo($('#parent1')); 
$('#child1').insertAfter($('#parent1')); 

あるフィドル：demo

Answer 4

$('#child1').insertBefore('#parent2');