title: reloading div without refreshing the whole page
body: <p>I have connected a mysql database with a div container inside form. But when there is a new element in the mysql database, i have to reload the whole page to show the new element inside the div.</p>
  
  <p>The code for div:</p>
  
  <pre><code>&lt;form method="post" action="startseite.php"&gt;
  &lt;div id="message"&gt;
  &lt;input type="text" name="spind" value="" size="55" maxlength="90"&gt;
  &lt;button&gt;Senden&lt;/button&gt;
  &lt;/div&gt;&lt;/form&gt;
  </code></pre>
  
  <p>My Javascript code for the div-container:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){
  
      $("#content").scrollTop($("#content")[0].scrollHeight);     
      $("button").click(function(){
      var message = $("input").val();
      var old = $("#content").html();
  
      $("#content").scrollTop($("#content")[0].scrollHeight);
  
      }); 
  });
  </code></pre>
  
  <p>The mysql database Code:</p>
  
  <pre><code>&lt;?php
  $verbindung = mysql_connect("localhost", "hallo", "123")
  or die("Fehler im System");
  
  mysql_select_db("hallo")
  or die("Verbindung zur Datenbank war nicht erfolgreich");
  
  
  $user = $_SESSION['username'];
  $message = $_POST['spind'];
  
  $eintrag = "INSERT INTO chat
  (user, message)
  
  VALUES
  ('$user', '$message')";
  
  mysql_query($eintrag);
  
  mysql_close($verbindung);
  ?&gt;
  </code></pre>
  
  <p>I have read that this could be done with AJAX, but maybe there is another way to do that without AJAX.</p>