how to hide dive on mouse click $(document).click will hide when I show the index page
<p>I have index page it should show my div with id myajaxdiv how to hide it when a user click n every where in the page? this code will hide it even in index page without any click.</p>

<pre><code>$(document).click(function() {
   $("#myajaxdiv").css({'display':'none'});
});
</code></pre>

<p>my div is empty and with ajax I will make it full
html:</p>

<pre><code>&lt;div class="well sidebar-nav"&gt;
          &lt;div id="myajaxdiv" &gt;           
            &lt;/div&gt;
</code></pre>

<p>and in ready function I have ajax:</p>

<pre><code>$.ajax({

        type:'POST',
        url:'news.php',
        success:function(data){
            var query ='';
    var mycontent = 'تازه ها&lt;hr/&gt;';
        $('.queryForm').hide(300);
    $('.message').html('');

    for(i=0;i&lt;data.length;i++) {

                    query = data[i];
                    mycontent += '&lt;ul class="starred-queries"&gt;&lt;li class="question"&gt;' + query.ques  + '&lt;/li&gt;';
                    mycontent +=  '&lt;li class="answer"&gt;' + query.answer + '&lt;/ul&gt;';                   

            }

            $('#myajaxdiv, .well #myajaxdiv').html(mycontent);
        }
    });
</code></pre>
