how to add event for all elements except which have a certain class?

Question

I want to add mouse over event on all elements on the page except which has class "no_inspect",

i want to add this event after loading all page elements, i tried to write it like that:

$('*:not(.no_inspect)').mouseover(MouseOverEvent);

but its not working, seams something missed.

UPDATE Not working means:

The event is attaching to all elements on the page "have no_inspect class or haven't" which is not the behavior i want.

UPDATE MouseOverEvent Code:

function DIOnMouseOver(evt) {
    element = evt.target;

    // set the border around the element
    element.style.borderWidth = '2px';
    element.style.borderStyle = 'solid';
    element.style.borderColor = '#f00';
}

Answer 1

The code you posted should work, are you sure the mouseover event is not firing for an element that is wrapping the one you are mousing over?

Are you using the latest and greatest version of JQuery. I know older versions had some sort of class bug in the not selector.

You may want to try

$('*').not('.no_inspect').mouseover(MouseOverEvent);

Answer 2

The mouseover event bubbles. Try mouseenter instead.

Also, why are you applying the styles to evt.target? Why not 'this'?

function DIOnMouseOver(evt) {
    $(this).css({
        border: '2px solid #f00'
    });
}

As mentioned by Matchu (in the comments), another way to avoid propagation is to call event.stopPropagation() within your event handler.