.hide(function(){ $(this).focus?

.hide(function(){ $(this).focus?

I would like to hide a form element by default and then show it when the area of it is clicked or gains focus. I tried this but I'm clearly missing something upstairs:
  1. $(function(){
        $('.detailsRow select').hide(function(){
            $(this).parent('li')focus(function(){
                $(this).find('select').show()
            });
        });
    });







This is the html:
  1.           <ul class="detailsRow">
                  <li class="col1">
                    <select name="service" style="width: 170px;" type="text" id="service"  >
                    </select>
                </li>
                <li class="col2"><textarea name="description" rows="2" style="width: 380px;" ></textarea></li>
                <li class="col3"><input name="amt" type="text" size="10" class="values" /></li>
              </ul>