Hi all, Can't quite get the the following functionality to work:
1. when I click on an un-checked checkbox, I want the box to be checked AND to raise an alert showing the text of the item which has just been checked. 2. Similarly if the user unchecks the box I want to raise an "unchecked" alert and then have the box unchecked. I have been trying to do this for about an hour but the behavior is: a. I am getting the "Checked" alert for clicks on both checked and unchecked checkboxes b. Once the user checks a box I get the "Checked" alert but the box never actually gets checked. The code is: $("#bChecklist > li").click(function(event){ var item = $(this).text(); // get the label value if ($(this).not(':checked')){ event.preventDefault(); alert ('Checking = '+ item) this.checked = true; // my attempt to force an unchecked box to be true // after using event.preventDefault } else if ($(this).is(':checked')) { event.preventDefault(); alert ('UnChecking = '+item) } }); <form id="myForm" name="myForm" action="/cm/BaB/create/" method="post"> ..... <div class="row" id="div2"> <fieldset id="bundleFields"> <!-- Add dynamically --> <legend id="bundleLegend" >Bundle Task</legend> <ul class="bChecklist" id="bChecklist"> <li><label for="o1"><input id="o1" name="o1" type="checkbox" class=bundleItem />MYTHINGY 1</label></li> <li><label for="o2"><input id="o2" name="o2" type="checkbox" class=bundleItem />MYTHINGY 2</label></li> <li><label for="o3"><input id="o3" name="o3" type="checkbox" class=bundleItem />MYTHINGY 3</label></li> </ul> </fieldset> </div><br clear="all"/> </form> Not quite sure what I am doing wrong. .