How to print this value using AJAX JQUERY on HTML
<p><strong>HTML</strong></p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;

$(document).ready(function(){
$("#but").click(function(){

    $.ajax({
        url: "action.php",
        type: "POST",
        dataType: "text",
        success: On_success,
        error: On_error
    });

    function On_success(response){
        alert(response);
        //$("#show").html(response);
    }

    function On_error(data){
       console.log(data);
    }      
    });
    });

  &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;

 &lt;form action="action.php" method="post"&gt;
 &lt;input type="text" name="mine"&gt;
 &lt;input type="submit" id="but"&gt;
 &lt;/form&gt;
 &lt;p id="show"&gt;HI&lt;/p&gt;
 &lt;/body&gt;
 &lt;/html&gt;    
</code></pre>

<p><strong>PHP</strong></p>

<pre><code>&lt;?php

$name = $_POST['mine'];

echo $name;

?&gt;
</code></pre>

<p>There is a input box, a submit button and a para tag on HTML
When I input a value and click the button.....the value is passed to PHP file...where the value is echoed.</p>

<p>Now using AJAX I fetch the response..(which should be value from the input box)</p>

<p>but the response I receive is :</p>

<p><img src="https://i.stack.imgur.com/tG5IX.jpg" alt="Image of response"></p>

<p>and then it goes on PHP page and displayed the input box value.</p>

<p>How should I print the value using AJAX response in the para tag?</p>

<p>Thanks in advance
Please help</p>