How to get checkbox value checked and show to input element using Javascript or Jquery?

but the value is only displayed when I click on the checkbox and it does not display the pre-selected values, I want it to show the selected results even if I do not click the checkbox, please correct this code Help me or give me some example code so I can add, thank you!

<script type="text/javascript">
function thayTheLoai() {
var huunhan_theloai = [];
$.each($("input[type='checkbox'].is(':checked'))"), function() {
huunhan_theloai.push($(this).val());
});
document.getElementById("input").value = huunhan_theloai.join(", ");
}
</script>

<input type="checkbox" value="1" id="theloai1" class="badgebox" name="theloai[]" ></input>

<input id="input" type="text"></input>

<script>
$('#theloai1').prop('checked', true);
</script>