I'm fairly new to jQuery, so this question may be very basic, but I need some help understanding.

I have a form button:

Code:
<input type="button" id="do" class="edit" value="Edit" />
I change the the class and the value via jQuery:

Code:
        $('.edit').click(function(){
          $('#do').attr('value', 'Submit');
          $('#do').attr('class', 'submit');
        });
So now it looks like this:

Code:
<input type="button" id="do" class="submit" value="Submit" />
Now, when I click on the changed button, I was anticipating the execution of this code:

Code:
        
      $('.submit').click(function(e){
          alert(this.form.id);
          info = $(this.form.id).serialize();
          info = info + '&do=' + $('#do-').val();
          e.preventDefault();
          $.ajax({
            type:   'POST',
            url:    'ajax.saveEvent.php',
            data:    info,
            success: function(data){
              $('#eventFormDiv').html(data);
            }
          });
        });
But, nothing happens, and Firebug records nothing on the console. So, as far as I can tell, the new class is not being recognized.

Any advice?

Thanks!