menu jquery hide and show

I Want a menu slide up from bottom html page with this attribut



<section>
<div id="error"></div>
<div id="ports"></div><br />

<div class="PortOption">

<!--Block for choosing, open and close comports-->
<select id="comPorts">
</select>
<select id=" BaudRate" onchange="GetB(this)" >
<option value="0">pick</option>
<option value="9600">9600</option>
<option value="115200">115200</option>
</select>
<button id="Connect">Connect</button>
<button id="Disconnect" disabled>Disconnect</button>



icon tab must hiden too

All port potion class/ must be inline div class="PortOption


</div>

<!--Block for choosing, open and close comports-->

<div class="PortOption">
<select id="comPorts1">
</select>
<select id=" BaudRate" onchange="GetB(this)" >
<option value="0">pick</option>
<option value="9600">9600</option>
<option value="115200">115200</option>
</select>



<button id="Connect1">Connect</button>
<button id="Disconnect1" disabled>Disconnect</button>
<br /><br />
</div>

<div class="PortOption">
<select id="comPorts2">
</select>
<select id=" BaudRate" onchange="GetB(this)" >
<option value="0">pick</option>
<option value="9600">9600</option>
<option value="115200">115200</option>
</select>
<button id="Connect2">Connect</button>
<button id="Disconnect2" disabled>Disconnect</button>
<br /><br />
</div>