在Radio点击中替换HTML中的DIV内容

Question

我有一个HTML，我们显示3个SELECT下拉和1个复选框。 要求只是根据无线电点击交换前两个选择下拉列表。

最初加载页面时（选择A中的视图B） 当您选择“在B中查看A”时，DIV内容应交换，UI元素应保持原样。即;选择选项C和选择选项D位置不应更改。 使用以下代码，所有SELECT都将重新排列。

var target1 = document.querySelector( '.swap-row > :first-child' );
var target2 = document.querySelector( '.swap-row > :nth-child(2)' );
var parent = target1.parentNode;
parent.insertBefore( target1, null );
parent.insertBefore( target2, parent.firstChild );

screenshot