My first ajax try ...need help

Hey everybody!

So i decided to play around with ajax for the first time ever. And i really think i do understand it.I coded 2 simple input boxes to pick up the name and the firstname to then spit it out in a sentence. I'm done with it,there r no syntax errors (atleast i dont see them). But still,it doesnt work!I'm filling in the textfields and submit it.....but nothing shows up. What am i doing wrong? I appreciate every little help and excuse my bad english. :)

index.html:

`<!doctype html>

<html> <head></head> <body> <h2>First try</h2>

First Name: <input id="first_name" name="first_name" type="text"> <br><br> Last Name: <input id="last_name" name="last_name" type="text"> <br><br>

<input name="myBtn" type="submit" value="Submit Data" onclick="ajax_post();"> <br><br>

<div id="status"></div> <script> function ajax_post(){ var hr = new XMLHttpRequest(); var url = "list.php"; var fn = document.getElementById("first_name").value; var ln = document.getElementById("last_name").value; var vars = "firstname="+fn+"&lastname="+ln; hr.open("POST", url, true); hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); hr.onreadystatechange = function() { if(hr.readyState == 4 && hr.status == 200) { var return_data = hr.responseText; document.getElementById("status").innerHTML = return_data; } } hr.send(vars); document.getElementById("status").innerHTML = "it's loading :D..."; } </script> </body> </html>`

list.php:

`<?php

if (isset($_POST["first_name"] ,$_POST["last_name"])){

echo "hi i am " .$_POST["first_name"]. "and my lastname is" .$_POST["first_name"];
exit();

}

?>`