chat

<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("#chatbox_title").click(function(){
        //alert("ch");
        $('#chatbox_body').toggle();
    });

    $("#chatbox_body li").click(function(){
        //$(this).toggleClass("active");
        //$(this).attr('id', this).text;
        alert($(this).attr('id'));
    });
});
</script>
<title>chatbox</title>
</head>
<body>
<div class="container">
    oldal tartalma
</div>
    <div id="chatbox_head" class="chatbox_head">
        <p id="chatbox_title">Chat</p>

        <div id="chatbox_body" class="chatbox_body">
            <?php
                $users=array("Csaba", "Zoli", "Gabi", "Pista", "Elemér", "Róza", "Sanyi", "Lacus", "Kriszti", "Erika", "Nóra", "Mária", "Ildikó", "Ernő", "Rozi", "Jakab", "Gipsz", "Péter", "Tamás", "Sándor", "Richard", );
                $num_users=count($users);
                sort($users); //!
                for($u=0; $u<$num_users; $u++){
                    //echo "<p id='$u'>$users[$u]</p>";
                    echo"<ul>
                        <li id='$u'>$users[$u]</li>
                    </ul>";
                }
            ?>
        </div>
        <div class="messbox">

        </div>
    </div>
</body>
</html>