Two radio buttons selcted at the same time

Question

I have an ascx partial view in my ASP.NET MVC application. I load the content of this partial view using jquery.load(). The partial view populates radio buttons which are associated to a certain class id which I handle its click event through $.live("click", function(){}) but I end up being able to select both radio buttons at the same time! i.e. I select the first radio button, click the second, and I get both of them selected. Any ideas?

My partial view looks like this:

<table>
<% foreach (var item in Model) { %>

    <tr>
        <td>
            <%: Html.RadioButton(item.Id.ToString(), item.Id, new {@class="radioCat" })%>
            <%: item.Name %>
        </td>
    </tr>

<% } %>
</table>

And my jquery event handler..

$(".radioCat").live("click", function () { alert('clicked'); });

Answer 1

Radio buttons needs to be in the same Group; add this.