Show Specific Value : <p>This is the code i try but when i select an item it show some array ouput i just want the specific value that i selected. like white-house</p>

<pre><code>  &lt;select id="item"&gt;
      &lt;option value=""&gt;Please select&lt;/option&gt;
      &lt;option value="white-house"&gt;The White House&lt;/option&gt;         
    &lt;/select&gt;
    &lt;div id="results"&gt;&lt;/div&gt;

    &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script&gt;
      function makeAjaxRequest(opts){
        $.ajax({
          type: "POST",
          data: { opts: opts },
          url: "tryonly.php",
          success: function(res) {
            $("#results").html("&lt;p&gt; " + res + "&lt;/p&gt;");
          }
        });
      }

      $("#item").on("change", function(){
        var selected = $(this).val();
        makeAjaxRequest(selected);
      });
    &lt;/script&gt;
</code></pre>

<p>In php code</p>

<pre><code>&lt;?php 

  echo '&lt;pre&gt;'; 
  print_r($_POST);
  echo '&lt;/pre&gt;';
?&gt;
</code></pre>

<p>the output when i select item </p>

<pre><code>Array
(
    [opts] =&gt; white-house
)
</code></pre>
