Why can't I trigger the `change` event of radio using jquery?

Question

The page is here:

http://cistrome.org/cps/seqconfig?did=2693

And the original js codes are below(this one works well):

$(document).ready(function(){
    $(".open_gene").on('change', function(event) {
        $('#Gene_field').show();
    });

    $(".close_gene").on("change", function(event){
        $("#Gene_field").hide();
    });
});

So the .close_gene has an event handler for change. But when I want to trigger this event manually to hide the #Gene_field, like this:

>>> $('.close_gene').trigger("change")

In FireBugs, the returned value is:

[input#nolimit_radio.close_gene all]

But the #Gene_field is not hidden..

I was wondering that why I can't trigger change event which should already bind to function(event){ $("#Gene_field").hide();}. Does anyone have ideas about this? Thanks!

Answer 1

Try this:

$(".close_gene").click();

Its working fine for me in Firebug Console... :)

Update:

This should also work, but will not change the state of radio button

$(document).ready(function(){
  $(document).delegate(".open_gene",'change', function(event) {
     $('#Gene_field').show();
  });

  $(document).delegate(".close_gene", "change", function(event){
     $("#Gene_field").hide();
  });
});

$('.close_gene').trigger("change");