검색 input 박스 질문드려요

<input type='text' id='test1'>

<div id='test2' style="display:none">
ddd
</div>

input이 test1이고 div(최근 검색목록)가 test2일때

<script>
/* 인풋을 클릭하면 div가 나타남 */
jQuery('#test1').click(function () {  
    if($("#test2").css("display") == "none"){   
        jQuery('#test2').css("display", "block");   
    } else {  
        jQuery('#test2').css("display", "none");   
    }  
}); 

/* 영역을 벗어나 다른곳을 클릭해도 div가 사라짐 */
$( document ).ready(function() {
    $(document).mouseup(function(e){
    var container = $("#test2");
    if(container.has(e.target).length === 0)
        container.hide();
    });
});
</script>

구글 같은데 클릭 display none 이렇게 검색하시면 많은 정보 얻으실수 있으실거에요.