使用“删除/附加在Div元素上”而不是“显示/隐藏”

Question

所以我一直在寻找创建按钮来显示通过摘录include宏从其他Confluence页面中提取内容的方法。

最初，我有代码来显示/隐藏包含摘录的div。很好，直到我提取了包含JS的多个摘录。

我认为分离/追加可能是一种更好的方法。我能够分离，但随后却很难添加。

// Original 
function showBizDash() { 
  $( ".BizDash" ).show(); 
  $( ".ProgDash" ).hide();
}

function showProgDash() { 
  $( ".ProgDash" ).show(); 
  $( ".BizDash" ).hide(); 
}

function resetSelection() { 
  $( ".BizDash, .ProgDash" ).hide(); 
}

// Updated - But not working
<button id="btn1" onclick="showBizDash()">Business View</button> 
<button id="btn2" onclick="showProgDash()">Program View</button>

<script>
  var showB = $(".BizDash");

$(document).ready(function() {
  $( ".BizDash, .ProgDash" ).detach();
});

function showBizDash() { 
  $('#displayDash').append(showB);
}

所需：单击按钮时，将显示包含摘录包含宏的相关Div，而其他div不可用。