Creating Dynamic Checkbox form dropdown values with events

function myfunction()
{
 var x = document.getElementById('mySelect');
 var txt = '';
    var i;
    var txtHtml='';
    for (i = 0; i < x.length; i++) {
    txt = x.options[i].text;
    txtHtml=txtHtml+'<input type="checkbox"  id="txt'+i+'" value="'+txt+'" class="branch" onclick="clickFun(this.id)">'+txt+'</input>';
    }
    document.getElementById('append').innerHTML=txtHtml;
}
function clickFun(txt)
{
    var x = document.getElementById(txt).value;
    document.getElementById('mySelect').value=x;
}
<div class="dropdownList">
    <select id="mySelect">
      <option value="test1">test1</option>
      <option value="test2">test2</option>
      <option value="test3">test3</option>
      <option value="test4">test4</option>
    </select>
</div>
<div id="append" name="append" />
<button class="btn btn-default" id="checkbtn" onclick="myfunction()" type="button">test</button>