how to make this change from checkbox to label element
<pre><code>&lt;html&gt;
&lt;body&gt;

&lt;script language="javascript"&gt;
window.onload=function(){

var container = document.getElementById('container'),
    template = `'&lt;li&gt;\
        &lt;input type="checkbox"&gt;\
    &lt;/li&gt;\
    &lt;li&gt;\
        &lt;input type="checkbox"&gt;\
    &lt;/li&gt;\
    &lt;li&gt;\
        &lt;input type="checkbox"&gt;\
    &lt;/li&gt;';`

container.onchange = function(e) {
    var event = e || window.event,
        target = event.srcElement || event.target;

    if( target.checked &amp;&amp; target.parentNode.getElementsByTagName('div').length === 0 ) {
        var ul = document.createElement('div');
        ul.innerHTML = template;
        target.parentNode.appendChild(ul);
    } else {
        var ul = target.parentNode.getElementsByTagName('div')[0];
        target.parentNode.removeChild(ul);
    }
};

}

&lt;/script&gt;

    &lt;ul id="container"&gt;
    &lt;li&gt;
        &lt;input type="checkbox"&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;input type="checkbox"&gt;
    &lt;/li&gt;
    &lt;li&gt;
        &lt;input type="checkbox"&gt;
    &lt;/li&gt;
&lt;/ul&gt;


&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>i need this program to be changed from checkbox to div element. actually when a checkbox is clicked three checkbox created beneath it and so on and if the parent checkbox is unchecked all the child checkbox are removed. now i need to change this checkbox element to ordinary label element. so that when a label is clicked a three label appears beneath it.. how to do that........</p>
