title: problem with i++ in jquery and javascript
body: <p>for a school project i'm making a jigsaw puzzle out of javascript and jquery. I have created 4 draggable div's that should be dropped at a point, and if all div's have been dropped at the right place, it should give a message that the puzzle is finished. everything is finished, except the part of the message. My IT teacher told me that I have to use a counter (i++) but I can't get this part working. Could you help?</p>
  
  <p>If you have the answer, can you explain it a bit as well? I don't have much experience with jquery/javascript.</p>
  
  <p>thanks in advance, Friso (Netherlands)</p>
  
  <p>the code of the important stuff(link to the page: <a href="http://friso.webatu.com/Site/droppable_jquery_met_javascript.htm" rel="nofollow">friso.webatu.com/Site/droppable_jquery_met_javascript.htm</a>)</p>
  
  <pre><code>&lt;script&gt;
  var i = 0;
  $(function() {
  
      $( ".draggable_l_t" ).draggable({ snap: ".droppable_l_t, .droppable_r_t, .droppable_l_b, .droppable_r_b", snapMode: "inner" });
      $( ".draggable_r_t" ).draggable({ snap: ".droppable_l_t, .droppable_r_t, .droppable_l_b, .droppable_r_b", snapMode: "inner" });
      $( ".draggable_l_b" ).draggable({ snap: ".droppable_l_t, .droppable_r_t, .droppable_l_b, .droppable_r_b", snapMode: "inner" });
      $( ".draggable_r_b" ).draggable({ snap: ".droppable_l_t, .droppable_r_t, .droppable_l_b, .droppable_r_b", snapMode: "inner" });
  
      $( ".droppable_l_t" ).droppable({
          accept: ".draggable_l_t",
          drop: function( event, ui ) {
  
                      i++;
          }
      });
  
      $( ".droppable_r_t" ).droppable({
          accept: ".draggable_r_t",
          drop: function( event, ui ) {
  
                      i++;
          }
      });
  
      $( ".droppable_l_b" ).droppable({
          accept: ".draggable_l_b",
          drop: function( event, ui ) {
  
                      i++;
          }
      });
      $( ".droppable_r_b" ).droppable({
          accept: ".draggable_r_b",
          drop: function( event, ui ) {
  
                      i++;
          }
      });
  
  });
  while (i==3)
  {alert('goedzo!');}
  &lt;/script&gt;
  </code></pre>