JQuery click only fires one action

Question

Can anyone help me understand why this is not working?

<div id="css-check" class="css-check tool-tip checkbox inline" ... 
    <input id="someid" name="somename" type="checkbox" value="somevalue" />
</div>

$('.css-check').bind({
  click: function() {
    $(this).toggleClass('clicked');
    this.children[0].click();   
  },
  mouseenter: function() {
    // do something on mouseenter
  }
});

Only the first action is taken. So, the class is toggled but the checkbox, that is the [0] child of the div, is not clicked.

EDIT

This works.

var $checkbox = $(this).children('input:first-child');
$checkbox.prop('checked', !$checkbox[0].checked);
$(this).toggleClass('clicked');

Welcome to Stack Overflow! Feel free to add your solution as an answer. — Axel Isouard, Sep 29 '12 at 07:41

score 0 · Accepted Answer · answered Aug 30 '12 at 13:37

0

change:

this.children[0].click();

to:

$(this).children('input:first-child').click();

Note: this triggers the click event, if you want to check the checkbox then use:

$(this).children('input:first-child').attr('checked', 'true');

answered Aug 30 '12 at 13:37

CKKiller

1,424
1
16
20

Hmm, didnt really work. The edit in my question dows work however. Thanks for pointing me in the right direction. – Kasper Aug 30 '12 at 14:05

JQuery click only fires one action

1 Answers1