找不到ID在外部选择数据库中使用ajax进行使用时，单击js

I'm designing an admin panel full Ajax and i have a problem... In a Page i select information db with ajax like this :

html

<body>
<div id="loadbox"></div> 
<script src="jquery.js"></script>
<script src="script.js"></script>
</body>

$(document).ready(function() {
    show_all();
});


    function show_all() {
        work = "select";
        $.ajax({
            type: "POST",
            url: "server.php",
            data: "work=" + work,
            success: function(data) {
                $("#loadbox").html(data);
            }
        });
    }

and server.php file :

$pdo = new PDO('mysql:host=localhost;dbname=test','root','');

if(isset($_POST['work'])){
    $work = $_POST['work'];


     if ($work == 'select') {
      $query = $pdo->query("SELECT * FROM t1");
      while ($s = $query->fetch()) {
      $name = $s['name'];
      $family = $s['family'];
      echo '<div id="xRight">'.$name.'</div>';
      echo '<div id="xLeft">'.$family.'</div><br>';
      }


   }
}

Now I need to use the id xRight for this cod :

$("#xRight").click(function(){
  $(this).addClass("vv");
});

But because div and id made in server.php file . id to be not found for use

How can I fix this problem ?!

i think it's working for you

$(document).on("click","#xRight",function(event) {
     // $(this).addClass("vv");
     $(event.target).addClass("vv");
});

Try This

$("#parent_container_of_xRight").on('click','#xRight',function(){
  //my cod js
});

Write the code :-

$("#xRight").click(function(){
  //my cod js
});

inside document.ready function . For example :-

$( document ).ready(function() {
      $("#xRight").on("click",function(){
      //my cod js
    });

});