jQuery form.submit() refreshing page instead of submitting

I'm using .submit() to detect when a form is submitted, but instead of performing its attached function, it's refreshing the page.

I'm building a tool for drawing family tree diagrams (using nested lists) at http://chris-armstrong.com/familytree .

To add a descendent, you turn controls on, and it adds

+

to each

(or generation).

When you click on an

+

element, it replaces the + with an

to detect when the submit button is clicked, and it should then replace the form with the contents of the , however at this point it just refreshes the page (and adds a ? to the URL).

Any ideas what I'm doing wrong? I've attached the whole function below.

function addAddListeners() {
            $('li.add_member').click(function(){

            //create input form
            $(this).html("
Add
")

            //listen for input form submission
            $("form.add_member").submit(function(){

            //if input form isn't blank, create new li element with content of form, else go back to the add_member li
            if($('form.add_member').val()) {
                        $(this).replaceWith('
'+$('input#fn_').val()+'
+
+
'); 
                        addEditListeners();
                        addAddListeners();  
                    } else {
                        alert("no change");
                    $(this).html("+");
                    }
                });

            });
        }

EDIT: Adding return false; stops the page refreshing, but the function attached to .submit() doesn't seem to be firing off, any ideas why?