Esta pregunta ya tiene una respuesta aquí:

Tengo un problema con la función preventDefault. No funciona Aquí está mi archivo JS:

(function() {
    var app = {
        initialize : function () {
            this.setUpListeners();
        },
        setUpListeners: function () {
            $('form').on('submit', app.submitForm);
        },
        submitForm: function(e){
            e.preventDefault();                
        }
    }

    app.initialize(); 
}());

Mi código HTML tiene 2 botones de confirmación. El segundo paso está oculto y debe mostrarse cuando se realice el primer paso. Pero al menos no puedo agregar preventDefault para el primer paso.

Aquí está mi HTML:

<form id="login">
    <!-- #first_step -->
    <div id="first_step">

        <h1>Registration Form</h1>
        <fieldset id="inputs">
            <div class="form-group">
                <label for="username">Username</label>
                <input type="text" name="username" id="username" class="form-control" placeholder="Create a username" required="">
            </div>

            <div class="form-group">
                <label for="password">Password</label>
                <input type="password" name="password" id="password" class="form-control" placeholder="Create a password" required="">
            </div>

            <div class="form-group">
                <label for="cpassword">Password</label>
                <input type="password" name="password" id="cpassword" class="form-control" placeholder="Confirm your password">
            </div>
        </fieldset>

        <fieldset id="actions">
            <div class="form-group">
                <input type="submit" class="submit" name="submit_first" id="submit_first" value="Next">
            </div>
        </fieldset>
    </div>

    <!-- #second_step -->
    <div id="second_step">
        <h1>Registration Form</h1>
        <fieldset id="inputs">
            <label>Name</label>
            <input type="text" name="name" id="firstname" class="form-control" placeholder="Enter your name" autofocus="" required="">

            <label>Surname</label>
            <input type="text" name="surname" id="lastname" class="form-control" placeholder="Enter your last name" required="">

            <label>Email</label>
            <input type="email" name="email" id="email" class="form-control" placeholder="Enter your email" required="">
        </fieldset>

        <fieldset id="actions">
            <input  class="submit" type="submit" name="submit_second" id="submit_second" value="Next">
        </fieldset>
    </div>
</form>

Lo siento. Solo soy un principiante en js y estaré muy agradecido si alguien me ayuda