$ .ajax在jQuery中不起作用

I need to execute php file inside jquery, but it is not working out. I don't post or get any values through ajax , just executing php file and should get success message.If I don't have ajax line code, click function working good. But If I have ajax code, click function doesn't work.

I have pasted the code below, I don't understand where it is going wrong.

HTML file

 <ul>
       <li id="logout"><a href="#" id="logout_nav">
       <span class="glyphicon glyphicon-log-out"></span> Log out</a></li>    
 </ul>

script:

$(document).ready(function(){
$("#logout_nav").on("click",function(){
    alert("This is a logout nav");
    $.ajax({url: 'logout.php', success: function(data){
        alert(data);
    });
   });
 });

logout.php

<?php
session_start();
if(isset($_SESSION["name"]) AND isset($_SESSION["email"])){
unset($_SESSION["name"]);
unset($_SESSION["email"]);
echo "logged_out";
}else{
    echo "no_sessions";
}

?>

Try this:

There is syntactical error in ajax:

<script>
$( document ).ready(function() {
    $("#logout_nav").on("click",function(){
        alert("This is a logout nav");
        $.ajax({ url: 'logout.php', 
            success: function(data) { // add curly braces for success method
                alert(data); 
            }
        });
    });
}); // add braces here
</script>