PHP/HTML: Creating A SubMenu



PHP Snippet 1:

<select id='depsel'>
    <option data-menu=1>1st Example
    <option data-menu=2>2nd Example
    <option data-menu=3>3rd Example
</select>
<span id='subopt' style='display:none;border:1px solid black;width:100px;min-height:200px;'></span>

<script>

    var menu=document.getElementById('depsel');
    var span=document.getElementById('subopt');

    menu.addEventListener('change',function(e){

        var selected=this.options[this.options.selectedIndex].dataset.menu;
        span.style.display='block';
        span.innerHTML='';


        var div=document.createElement('div');
            div.innerHTML=this.value;
            div.onclick=function(evt){
                span.style.display='none';
            }
        span.appendChild( div );

    }.bind( menu ),false );

</script>