jquery input field focusout div
<p>In script below: 
I am creating like a select option droplist,</p>

<p>But, if I use <code>focusout</code> event on text id after my selected text val event does not work! </p>

<p>Any alternative solution?</p>

<p>focusout event in block comment</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){
        
        //droplist toggle
        $('#text').click(function(){
         $('.droplist').toggle();
        });
        
         // text move to input field
         $('.droplist p').click(function(){
          var selected = $(this).text();
          $('#text').val(selected, $('.droplist').hide());   
         });
          
        // input field foucsout
        
        /*$('#text').focusout(function(){
         $('.droplist').hide();
        });*/
         
 });</code></pre>
<pre class="snippet-code-css lang-css prettyprint-override"><code> #text{
        width:200px;
        height:35px;
        padding-left:10px;
        box-sizing: border-box;
        margin-bottom:3px;
  }
 .droplist{
        width:200px;
        background-color:#D8D8D8;
        border-radius:4px;
        padding:5px;
        position:absolute;
        box-sizing: border-box;
        font-family:arial;
        font-size:15px;
        display:none;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;script    src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"&gt;&lt;/script&gt;    

&lt;/head&gt;
&lt;body&gt;
&lt;div style="margin:20px;"&gt;
 &lt;input type="text" id="text" autocomplete="off" placeholder="Select Option" /&gt;
 &lt;div class="droplist"&gt;
  &lt;p&gt;option one&lt;/p&gt;
  &lt;p&gt;option two&lt;/p&gt;
  &lt;p&gt;option three&lt;/p&gt;
  &lt;p&gt;option four&lt;/p&gt;
  &lt;p&gt;option five&lt;/p&gt;
 &lt;/div&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;  </code></pre>
</div>
</div>
</p>