Posting both checked and unchecked checkboxes
===

I'm trying to make a series of checkboxes in a web form that will post either "true" or "false" to the next php page, depending on whether they are checked. I decided that for each checkbox (value="true"), I would have a hidden checkbox (value="false") that would always be the opposite (when checkbox is checked, hidden checkbox is unchecked etc.) I am using jQuery to do this.

The number of 'td' elements is unknown (the 'td' can be cloned an infinite number of times using a button, to submit multiple values). I added the alerts to the jQuery for testing purposes.

When I added the jQuery code and hidden checkbox into my source code (I made it visible for testing purposes), the code wouldn't work AND all the other jQuery on my web page stopped working!

Please help!! :)

jQuery code:

	$(document).ready(function(){
		/***post all 'required' checkboxes instead of just checked ones***/
		$(".required").click(function(event){
			event.preventDefault();
			alert("test");
			nextIndex = this.index() + 1;
			alert(nextIndex);
			$(".required:eq(nextIndex)").attr("checked", !.required:eq(nextIndex).attr("checked"));
		});
	});

HTML:

    <td>
    	<input type="checkbox" class="required" name="required[]" value="true">
    	<input type="checkbox" class="required" name="required[]" value="false" style="display: none;" checked>
    </td>