I'm having trouble using the event.preventDefault(); for an ahref on my DOM

It is possible that instead of just event.preventDefault(), you need to do return false also or instead. preventDefault() prevents the default action, but the event still bubbles up, possibly to the next handler, which could be the rails handler that Fredrik pointed out:

 $(rails.linkClickSelector).live('click.rails', function(e) {
    var link = $(this);
    if (!rails.allowAction(link)) return rails.stopEverything(e);

    if (link.data('remote') !== undefined) {
      rails.handleRemote(link);
      return false;
    } else if (link.data('method')) {
      rails.handleMethod(link);
      return false;
    }
  });

Are you using rails? Looks like it.

The reason event.preventDefault() doesn't work is because the magic is done elsewhere. Rails comes with some helpers that creates event handlers for all the "delete" actions generated by Rails. So in your case I think that you need to find out how to override the helpers or just create a custom event handler for that specific delete action.

This is the JQuery code that Rails uses:

https://github.com/rails/jquery-ujs/blob/master/src/rails.js

Based on this (from the link):

linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]'

Your event handler will be the only one executed if you'd remove data-remote, data-method and data-confirm from the link.

So I suggest that you remove them and then just re-create whatever behavior you want in your own click handler.