javascript - how to set click event on parent using jquery? -

following html structure i'm using

<div id="divid">    <table>      <tr>        <td onclick="var ele = document.getelementbyid('inputid'); ele.click();">           <input id="inputid" onclick="event.stoppropagation();"  name="nameofelement" type="checkbox"/>        </td>      </tr>     </table> </div> 

i'm trying set click event on element using jquery follows:( other functionality elsewhere in page)

 $("#inputid").parent().on('click',function(){ // call other functions}) 

this attachment leads following error:

  uncaught error: syntax error, unrecognized expression: ) 

i have give following functionality:

1. if user click on td input element must checked , if clicked on click event must not propagated parent i.e. td reverse effect.

2. also want jquery's click event execute.

currently, first functionality working , event.stoppropagation() stoping second one.

how can achieve both of them?

please have @ http://jsfiddle.net/zqg0lgbh/4/ demo of issue.

first, remove ugly inline event handlers.

then, use jquery ensure click on cell containing radio button checks radio button :

$('td:has(>input[type=radio])').click(function(){    $('input[type=radio]', this).prop('checked', true); }); 

this way don't have use stoppropagation.

demonstration (note fixed few other things, using fixing missing name in function declaration or importing jquery.

asides:

• you should stop using inline styles , inline event handlers. code isn't maintainable.
• changing behavior of widgets , surroundings isn't best practice surprises user , leads various ergonomics problem