tr要素ノードを挿入

HTML

<table>
  <tbody>
    <tr id="skill_select" class="skill_select">
      <td>
        <select name="programs1_[]">
          <?php echo Programmerskill::getSkill(); ?>
        </select>
     </td>
      <td>
        <select name="programs_year1_[]">
          <?php echo Skillyear::getYear(); ?>
        </select>
      </td>
    </tr>
    <tr id="skill_selectAdd">
      <td colspan="2">
        <input type="button" value="追加" onClick="skill_selectAdd()">
        <input type="button" value="削除" onClick="skill_selectDel()" id="skill_select_btnDel" disabled="true">
      </td>
    </tr>
  </tbody>
</table>

JavaScript

'use strict';

/*スキルエリアのセレクトボックスセットのクローン*/
function skill_selectAdd () {
var get = document.getElementById("skill_select");
var set = get.cloneNode(true);
var target = document.getElementById("skill_selectAdd");
var btn_delete = document.getElementById("skill_select_btnDel");
    set.id= "test" + target.children.length;//idの重複を防ぐため、連番をつけておく
    target.parentNode.insertBefore(set, target);
    btn_delete.disabled = false;
}
/*スキルエリアのセレクトボックスセットの削除*/
function skill_selectDel () {
  var targets = document.getElementsByClassName("skill_select");
  var btn_delete = document.getElementById("skill_select_btnDel");
  if (targets.length === 2) {
      btn_delete.disabled = true;
  }
  targets[1].parentNode.removeChild(targets[targets.length - 1]);//最後の要素を削除
}