JQuery - event.preventDefault(); no funciona

Hola amigos,

estoy desarrollando una aplicación primero añado un botón de esta forma

$("#contenedorcampos").append("<input type='submit' id='botonZonas' value='Nueva zona'>");

y posteriormente quiero que no me envie el formulario sino que llame a una función para ello escribo:

<script src="jquery-1.11.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {

$('#botonZonas').click(function(event) {
event.preventDefault();
});

});

</script>

pero me sigue enviando el formulario, gracias cualquier respuesta es bienvenida.

Hola Joaquin, tienes que volver a definir el evento una vez has añadido el botón, ya que si no, no se generara el evento...

Ten en cuenta que cuando se carga el DOM de la pagina, se establece el javascript, el cual no se modifica aunque varié el contenido de la pagina, por lo que no se da cuenta de los cambios.

Una vez añadido el botón, vuelve a definir el evento.

Coméntanos, ok?

Hola! yo tambien tengo un problema con preventDefault. Soy principiante en Jquery y hice una pequeña prueba tal que asi:

Archivo prevent.html


Archivo prueba.js


No se si esta bien pero mi intencion es que preventDefault deberia evitar que acceda al enlace
y mandar la alerta Hola. Pero me sigue llevando hacia el enlace.

Se me olvido incluir el script <script src="http://code.jquery.com/jquery-2.1.3.js"></script>
Pero aun asi sigo sin resultados