Getting "Object # <NodeList> has no 'click' error?"

Question

I am trying to add multiple form fields to separate divs. But by adding some divs with buttons, I get the following error when I click a button in a div:

Object # does not have a 'click' method

I get this error when I move the </form> under the second or third div. I do not get an error when I put the </form directly under my first div. The form has a total of 4 divs all with a bunch of buttons.

The next button shows only the next button (a simple jquery / slidedown slide show). Each button launches a function called win() so

 <input type=button class="team round1" value="a1" name="WIN0_1" onclick="win(this)"/> 

Now on the div I gave some buttons the same name (for example: name="WIN0_1" exists 4 times)

Sorry for this chaotic post, but I hope someone has a suggestion

PS: as for the form in separate divs, I followed this tutorial.

Answer 1

Ok, so based on your code http://jsfiddle.net/123js/Xm5Rt it looks like copying a div with input, you get a set of buttons on this line:

 var winnerButton = winner.form.elements["WIN"+nextlevel+"_"+nextgame]; 

therefore winnerButton not 1, but several buttons.

when you try to call click() in the collection of elements, you will get the error you specified.

There can be many things in the solution ... To be sure you need to post the full html (form + div + input) so that we can look at beter.

Answer 2

A NodeList object is a collection of Node objects typically returned by childNodes or getElementsByTagName / getElementsByTagNameNS . Find your code for .click( , and you will most likely find that it is bound to an object whose value is the result of one of these operations, and not a jQuery object as you expected.

You can easily reproduce this error in order to understand what I mean by typing the following in the JS console:

 document.getElementsByTagName("div").click(); 

If you are trying to find the cause of the problem, you need to publish your code.