HTML connection to MySQL

You should really at-least try Google before posting here.

Google Search: ajax login code

This is a very simple implementation but can be a starting point. http://woork.blogspot.com/2007/10/login-using-ajax-and-php.html

You may need to read up on ajax a little if this doesn't make sence: http://code.google.com/edu/ajax/tutorials/ajax-tutorial.html

AJAX is really nothing more than JavaScript which connects to a server-side resource (such as a PHP-backed page), receives a result, and likely does some UI manipulation of the HTML as a response to that result. A good place to get started is the jQuery ajax method. Using the jQuery JavaScript library will make the process much simpler. But, ultimately, it'll connect to your PHP code on the server to perform the actual database interaction.

Beyond that, it sounds like you're lacking a good bit of design oversight in this project. The statement "I also read that I should use AJAX to connect to the database." is particularly troubling. Where did you read that? Why did you read that? There seems to be little value in that suggestion beyond someone somewhere thinking that "AJAX is cool and people should use it for stuff."

Is there a specific design concern for using AJAX vs. just posting a form to some PHP code?

Although it's not necessary to use AJAX for this, you can use something like below.

Considering you have an element that has a username and password like below:

<div id="login">
  <label for="txtUsername">Username:</label>
  <input type="text" id="txtUsername" />
  <label for="txtPassword">Password:</label>
  <input type="password" id="txtPassword" />
  <button id="btnLogin">Log In</buton>
</div>
<div id="logout" style="display: none;">
   <a href="logout.php">Log Out</a>
</div>

Then, having jQuery already referenced call your PHP page ("login.php" in the example):

<script type="text/javascript">
$(function() {
  $("#btnLogin").click(function() {
    $.ajax({
      url: "login.php",
      data: {username: $("#txtUsername").val(), password: $("#txtPassword").val()},
      success: function(data){
        $("#login").toggle();
        $("#logout").toggle();
      }
    });
  });
});
</script>

If I understand your question correctly, there are two ways you could handle this. The first (and most common) way is to just set the PHP script as the action of your HTML form:

<form method="post" action="folder/phpfile.php">
  <input type="text" name="username" />
  <input type="password" name="password" />
</form>

After doing this, make sure your PHP script takes in the post variables as $_POST['input_name'], where input_name is the name you used in the inputs on your HTML form (as 'username' and 'password' are used above).

Using AJAX for authentication is not always the best way to handle things in my opinion, but it is doable. I would recommend you try using JQuery behind your JavaScript if you are going to go the AJAX route. They have a really handy framework for handling AJAX queries and events.