How to bind jQuery event when ASP.NET MVC renders Model

Question

I have following HTML code under Requisition.cshtml

    foreach (var item in Model.RequisitionWorks)
    {
        <tr>
            <td><div class="radio"><label name="@string.Format("Option_{0}", item.OptionNumber)">@item.OptionNumber</label></div></td>
           <td>
               <div class="radio">
                  <label>@Html.RadioButton(string.Format("Option_{0}", @item.OptionNumber), 
"0", @item.IsOptionChecked("0"), new { @class = "OptionClass", id = string.Format("Option_None_{0}", @item.ToothNumber) }) @MyModelEntities.Properties.Resource.None
    </label>
  </div>
</td>

And I generate lots of radiobuttons...

So I would like to bind some jQuery event at the moment of rendering that code.

  $("#Option_None_" + optionNumber).change(function () {
  });

I need it because I generate id of html tag on fly.

Is it possible to do?

Answer 1

Why not apply using the class of the option instead of an id?

$(document).ready(function(){
  $(".OptionClass").change(function () {
   });
});

Answer 2

You can do this by using the .on jquery method (http://api.jquery.com/on/). To accomplish this you would select your containing div and then set the onchange for the inputs within it.

$('div.radio').on('change', 'input', function() {});

Edit: it's a lot easier to do what you want to if you give the radio buttons a common class and use the above method. Generally it's not necessary use something unique like the id to attach the same event handler to each one.