How to bind to a click to toggle a checkbox?
===

Given a list of LIs each LI includes a checkbox like so:

    <li class="contact">
        <input type="checkbox" class="checkbox" name="checkableitems[]" value="1333">
        <div class="content">
            <cite>Baby James</cite>
        </div>
    </li>

I would like to be able to toggle the checkbox on LI click, not just on checkbox click. I got this work which you can see here: 

http://jsfiddle.net/xgB5X/2/

The problem is, while clicking on the LI toggles the checkbox, click on the checkbox directly is no broken. Clicking on the checkbox no longer toggles. Any suggestions to get this working? Thanks