Change style for all elements with a click event

Question

I'm in the process of learning JQuery as I'm doing a major redesign of a site. I realize how nice it would be to do some styling in the javascript instead of remembering to add the right css class to every div (apparently, I like to forget such things).

Anyway, I want to add the style cursor: pointer; to all elements that have a click event registered. I think it needs to look something like this:

$("div").Find(/*Has Click Event*/)
  .css("cursor", "pointer");

In terms of performance, I think it would be better for you to remember to add this into the styles, than do a javascript workaround — Curtis, Mar 09 '12 at 16:25
http://stackoverflow.com/questions/1515069/jquery-check-if-event-exists-on-element and http://www.codenothing.com/archives/jquery/event-filter/ — NimChimpsky, Mar 09 '12 at 16:28
Read this: http://stackoverflow.com/questions/1236067/test-if-event-handler-is-bound-to-an-element-in-jquery As Curt said, it won't be efficient to use JS to do it but it is possible or get this plugin http://www.codenothing.com/archives/jquery/event-filter/ — Nick Bork, Mar 09 '12 at 16:28
You should avoid applying styles via JS as much as possible, and try to keep content(html), styling(CSS) and functionality(JS) separated. — Christoph, Mar 09 '12 at 16:30

karim79 · Accepted Answer · 2012-03-09T16:36:57.357

2

$("div").each(function () {
    if($(this).data("events") !== 'undefined' && $(this).data("events").click) {
        $(this).css({"cursor": "pointer", "border": "1px solid red"});
    }
});

Demo.

edited Mar 09 '12 at 16:36

answered Mar 09 '12 at 16:29

karim79

339,989
67
413
406

the first selector should be div not asterix ? (for the puprose of this question) – NimChimpsky Mar 09 '12 at 16:31

Change style for all elements with a click event

1 Answers1