JavaScript Click function element.click not working

Question

I have javascript method which will remove applied class from DOM element on click. And the code is like

 $(function() {

     NS.toggleSortableClickHandler = function(element) {
         console.log("elememnt inside toggleSortableClickHandler  " + element)
         element.click = function onClick(e) {
             console.log("CALLED toggleSortableClickHandler")
         }
     }

     var ele = document.getElementById('mytoggler');
     console.log("document.getElementById('mytoggler') " + ele)
     NS.toggleSortableClickHandler(document.getElementById('mytoggler'));

 });

And the HTML code is:

<ol class="sortable" >
    <li id="mytoggler">List Item 11</li>
</ol>

So i expect that when i click on the li item console should print

CALLED toggleSortableClickHandler

But i didn't get anything when i click the item.

possible duplicate of How to use onclick in JavaScript

Greg Burghardt
– Greg Burghardt

2015-08-25 13:01:43 +00:00
Commented Aug 25, 2015 at 13:01 — Greg Burghardt
– Greg Burghardt, Commented Aug 25, 2015 at 13:01

Pointy · Accepted Answer · 2015-08-25 12:58:28Z

3

If you're going to install an event handler via the DOM property, it's "onclick", not "click":

     element.onclick = function onClick(e) {
         console.log("CALLED toggleSortableClickHandler")
     };

However, you're apparently using jQuery anyway, so you might as well use it:

     $(element).on("click", function onClick(e) {
         console.log("CALLED toggleSortableClickHandler")
     });

answered Aug 25, 2015 at 12:58

Pointy

415k62 gold badges600 silver badges632 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Fabio Lolli · Accepted Answer · 2015-08-25 13:05:39Z

0

First of all, you forgot the brackets, it should be

.click()

and you can't use the "=" operator after that. What you want to do isn't pure JavaScript, it's jQuery, and the syntax isn't correct.

In JavaScript,

element.click();

triggers the click event on element. In jQuery, if you want to assign a function to click event handler, you should use the syntax

element.click(yourFunction());

I would also suggest changing the name of your handler function, since onClick is an attribute used in HTML language to specify the click event handler. This may create some confusion in the readability of your code.

By the way, onClick is used like this, fyi.

<div onClick="myFunction()"></div>

answered Aug 25, 2015 at 13:05

Fabio Lolli

8897 silver badges23 bronze badges

Collectives™ on Stack Overflow

JavaScript Click function element.click not working

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related