[code]
<style type="text/css">
.SearchWrap { display:inline-block; vertical-align:top; width:96px; }
.SearchJQuery { border:1px solid #d4d4d4; height:30px; position:relative; cursor:pointer; }
.SearchJQuery span { position:absolute; top:10px; right:14px; color:#e60012; }
.SearchJQuery div { position:absolute; top:10px; left:7px; color:#2a2a2a; font-weight:bold; }
.SearchJQuery ul { position:absolute; border:1px solid #d4d4d4; border-bottom:0; width:100%; top:30px; left:-1px; background-color:#FFF; margin:0; padding:0; display:none; }
.SearchJQuery ul li { list-style-type:none; height:24px; line-height:26px; padding:0 0 0 7px; cursor:pointer; color:#999; border-bottom:1px solid #d4d4d4; }
.SearchJQuery ul li:hover { background-color:#ddd; color:#000; }
</style>

<span class="SearchWrap">
<div class="SearchJQuery">
<span>▼</span>
<div></div>
<input type="hidden" value=""/>
<ul>
<li title="">전체</li>
<li title="sell">상품명</li>
<li title="home">상점명</li>
</ul>
</div>
</span>


<script type="text/javascript">
$(".SearchJQuery").click(function(){
$(this).children('ul').toggle(100);
});

$(".SearchJQuery").each(function(){
if($(this).children('input').val()){
$(this).children('div').text($(this).children('ul').children("li[title='"+$(this).children('input').val()+"']").text());
}else{
var NotTitle = $(this).children('ul').children("li[title='"+$(this).children('input').val()+"']").text();
if(NotTitle){
$(this).children('div').text(NotTitle);
}else{
$(this).children('div').text($(this).children('ul').children('li:first').html());
$(this).children('input').val($(this).children('ul').children('li:first').attr('title'));
}
}
});

$(".SearchJQuery > ul > li").click(function(){
$(this).parents('div').children('div').text($(this).text());
$(this).parents('div').children('input').val($(this).attr('title'));
});
</script>
[/code]

개코딩 이해 바랍니다....
필요해서 만들었는데 팁으로 올려놓으면 쓰신분들이 있으실거 같아서! 올려봅니다. ㅎ