I want to retrieve data from a mySQL server by using jQuery, which triggers a PHP script to receive the data. However, the `$.post` function from jQuery does not work at all and corrupts all the code, and I don't understand why.

Here is my JS code: 

```
$('button#btnSubmit').on('click', function() {
    //Compare button pressed
    var sel1 = $('select#country1').val(); //country iso codes
    var sel2 = $('select#country2').val();

    if(sel1 === "placeholder1" || sel2 === "placeholder2" || sel1 === sel2) {
        alert("Please select at least two different countries")
    }
    else {
        //post this to php file to retrieve data
        try {
            $.post('ajax/retrieve_data.php', { sel1: sel1, sel2: sel2 }, function(data) {
                $('div#test-data').text(data);
        }
        catch(err) {
            alert(err.message);
        }
    }
});

```

I included the jQuery library in my main HTML page with this: 

```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

```

The `$.post` message corrupts the entire code, nothing works. When I remove it, the first part of the code works as it should. I have the feeling this is extremly easy to fix but I can't wrap my head around why it does not work.
Thank you!