event.preventdefault not working in Firefox

Question

I am using the below bit of jQuery to toggle hidden divs. Working in all but Firefox and I know the error is (ReferenceError: event is not defined) but I'm not sure where to define the event so if anyone is able to help that would be great. Thanks in advance!

Each button is written as:

<div class="btn_view"><a href="#" onclick="toggle_visibility('all-avon',this);">VIEW TYRES</a></div>

jQuery:

function toggle_visibility (id,el) {
    $('.btn_view a').html('VIEW PRODUCTS’);
    event.preventDefault();
    $('.price-text').show();
    $('.model-price-sm').show();
    var e = document.getElementById(id);
    if (e.style.display == 'block') 
    {
        e.style.display = 'none';
        $(el).html('VIEW ALL');
    }
    else 
    {
        e.style.display = 'block';
        $(el).html('HIDE PRODUCTS’);
        $(el).parent().parent().find('.price-text').hide();
        $(el).parent().parent().find('.model-price-sm').hide();
        //$(el).parent().prev('.price-text').hide();
    }

    hideAllBut(id);
}

function hideAllBut(id) {
    var lists = document.querySelectorAll('.reveal');
    for (var i = lists.length; i--; ) {
        if (lists[i].id != id) {
            lists[i].style.display = 'none';
        }
    }
}

Answer 1

In FireFox, you can pass the event object in as a parameter e.g.:

<div class="btn_view"><a href="#" onclick="toggle_visibility('all-avon',this, event);">VIEW TYRES</a></div>

function toggle_visibility (id,el, e) (then use e.preventDefault, just to make it separate to window.event in IE etc)

Although, as you are using jQuery, I would suggest doing what Sergio mentioned above/below.

Answer 2

Instead of using "event.preventDefault()" you could use "return false". It probably will solve your problem in Firefox.

Cheers