I've been trying to get a div to show and hide based on a dropdown.

I have 3 hidden divs but only 2 show. The issue is I have to have multiple ID's for some divs.
the two display as handset are fine but the id="Handset Tablet" won't show. Does my jquery need to see if it just contains the id as I guess it is just looking for "Handset" not two.

Here is my code. I need to have all 3 divs with Handset show and Tablet only show the shared one somehow.
<http://jsfiddle.net/jonasj/k2sxdh5s/>

```
   <div class="form-group"><label class="col-md-3 control-label">Product Type</label>
        <div class="col-md-9">
        <select name="product_type" id="product_type" class="form-control check_record">
                <option selected value="0" >-Select Product Type-</option>
                <option value="Handset">Handset</option>
                <option value="Tablet" >Tablet</option>
        </select>
        </div>
    </div>

        <div id="Handset" class="hide_listing form-group"><label class="col-md-3 control-label">Spec</label>
        <div class="col-md-9">
            <select class="form-control" name="spec">
                <option selected value="" disbaled>- Device Spec -</option>
            </select>
        </div>
        </div>

        <div id="Handset" class="hide_listing form-group"><label class="col-md-3 control-label">Capacity</label>
        <div class="col-md-9">
            <select class="form-control" name="device_capacity">
                <option selected disabled value="">- Select Device Capacity -</option>
                <option value="2GB">2GB</option>
                <option value="4GB">4GB</option>
                <option value="8GB">8GB</option>
                <option value="16GB">16GB</option>
                <option value="32GB">32GB</option>
                <option value="64GB">64GB</option>
                <option value="128GB">128GB</option>
                <option value="256GB">256GB</option>
                <option value="Unknown">Unknown</option>
            </select>
        </div>
        </div>

        <div id="Handset Tablet" class="hide_listing form-group"><label class="col-md-3 control-label">Sim Status</label>
        <div class="col-md-9">
            <select class="form-control" name="device_sim">
                <option selected disabled value="">- Select Device Sim Status -</option>
                <option value="Sim Free">Sim Free</option>
                <option value="Network Locked">Network Locked</option>
                <option value="Network Unlocked">Network Unlocked</option>
                <option value="Unknown">Unknown</option>
            </select>
        </div>
        </div>    

<script>
$(document).ready(function () {
  $('.hide_listing').hide();
  $('').show();
  $('#product_type').change(function () {
    $('.hide_listing').hide();
    $('div#'+$(this).val()).show();
  })
});
</script>

```