자바 스크립트/Google 스크립트를 사용하여 선택한 체크 박스 값을 HTML로 표시

Google 시트의 항목을 기반으로 체크 박스 드롭 다운 요소를 만드는 요소 선택을 만들었습니다.

내 HTML 코드는 다음과 같습니다.

<div class="form-row">
<div class="multiselect form-group">
<div class="selectBox" onclick="showCheckboxes()">
<select class="form-control" >
<option>Select an option</option>
</select>
<div class="overSelect" ></div>
</div>
<div id="checkboxes">
</div>
</div>

내 자바 스크립트 코드는 다음과 같습니다.

<script>
document.addEventListener("DOMContentLoaded", afterLoad);
document.getElementById("checkboxes").addEventListener("change", loadDisplayPos);
function afterLoad(){
google.script.run.withSuccessHandler(loadPosApp).checkPosApp();
}
function loadPosApp(postOpen){
   postOpen.forEach(function(r){
     
   var checkbox = document.createElement('input');
   checkbox.type = 'checkbox';
   checkbox.value = r[0];
 
   var label = document.createElement('label')
   label.appendChild(checkbox);
   label.appendChild(document.createTextNode(" " + r[0]));
  
   var content = document.getElementById('checkboxes');
   content .appendChild(label);
   });
}
function loadDisplayPos(){
  var contentCheck = document.getElementById('checkboxes').value;
  console.log(contentCheck);
}
function showCheckboxes() {
  var checkboxes = document.getElementById("checkboxes");
  if (!expanded) {
    checkboxes.style.display = "block";
    expanded = true;
  } else {
    checkboxes.style.display = "none";
    expanded = false;
  }
}
</script>

내 Google Apps Script 기능은 다음과 같습니다.

function checkPosApp()
{
  const ss = SpreadsheetApp.openByUrl(url);
  const ws = ss.getSheetByName("VacantPositions_Data");
  //const myDates = ws.getRange(2, 1, ws.getLastRow()-1, 1).getValues();
  var postOpen = ws.getRange(2, 1, ws.getLastRow()-1, 1).getValues();
  Logger.log(postOpen)
  return postOpen;
}

Web App이로드되면 Google 시트의 값을 드롭 다운 확인란으로 Web App에로드합니다. 내 문제는 선택한 항목을 선택한 요소 선택에 표시하는 방법입니다. 요소 ID "체크 박스"의 값을 얻으려고했지만 정의되지 않은 것으로 표시됩니다. 제안이나 조언이 있습니까? 나는 여전히 해결책을 찾으려고 노력하고 있습니다. 도움을 주셔서 미리 감사드립니다.