Pulling info from MySQL using PHP, AJAX and jQuery and show in pop up-CodePudding

I am currently working on a project that is a bit of a learning curve for me at the moment so I thought I'd turn to stack to see if anyone can help me make sense of a hole I appear to be digging myself...

I'm working on a Text browser game that has a very basic vector map (For now), see screenshot in link below to see how it current looks.

Preview of instance and what I'm looking for it to do

My idea is that when you click one of the SVG paths, a pop up shows information based on the id that is in <path id=""

Right now, the code looks like this because it's not dynamic.. propertyDetail and prop2 are the same div, just different content inside them, I want it to be one div, that loads the content based on a mysqli query, finding info from properties based on the id="" in path that's clicked.. So for this example, in the MySQL database the property id will be Path_27 or Path_57

<script>
$(document).ready(function () {
    $("#Path_27").click(function(){
        $(".propertyDetail").fadeToggle();
    });
    $("#closeDetail").click(function(){
        $(".propertyDetail").fadeToggle();
    });
    $("#Path_57").click(function(){
        $("#prop2").fadeToggle();
    });
    $("#closeDetail2").click(function(){
        $("#prop2").fadeToggle();
    });
});
</script>

The code for the PHP, well it's pretty simple right now too.. just a lookup based on the id that will be passed from the UI when clicked...

$query = $dbb->query("SELECT * FROM properties WHERE id = $id LIMIT 1");

Now I know this will be an AJAX request and not just as simple as the code above, but I don't currently know where to even start to achieve what I'm trying to do in a scalable way