Accordion Moving Up

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css">
<div id="wrapper">
<div id="select" class="inner">
    <select id="test-options">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="date">Select date time</option>
</select>
</div>
<div id="datepicker" class="inner">
    <p>Date: <input type="text" id="datepicker-input"></p>
</div>
</div>

CSS

#wrapper{margin:10px;}
div.inner{padding:20px 5px;}
.ui-datepicker-trigger{display:none;}

JavaScript

$(function() {
    var $datepicker = $( "#datepicker-input" ); 
              
    $datepicker.datepicker({
        showOn: "button",
        afterShow: function(input, inst) {
           $(input).datepicker('setDate', new Date());
            alert(document.getElementById("#datepicker-input").value);
          }
   });

    $('#test-options').change(function(){
        if($(this).val() === 'date'){
            $datepicker.datepicker( "show" );
        }        
    });
    
});