I have a problem with the following code in an ASPX page:

<script type="text/javascript">
$(document).ready(function() {
	$('.test').click(function() {
		alert("click")
	})
});
</script>

<asp:CheckBox runat="server" Text="Checkbox XYZ" CssClass="test" ID="cb1" />

In the browser (FF3.5 / IE8) I have the following problem:

• if I click the checkbox (the small square), it works as expected
• if I click the checkbox's text ("Checkbox XYZ"), then the click event is fired twice, and the alert is shown twice

I guess this has to do with the way the checkbox is rendered to HTML, which is like this:

<span class="test">
 <input id="ctl00_c1_cb1" type="checkbox" name="ctl00$c1$cb1" checked="checked" />
 <label for="ctl00_c1_cb1">Checkbox XYZ</label>
</span>

How do I correctly setup the click event handler to prevent it from being called twice?