I want to be able to add an attribute to a HTML element to be able to identify what its referring to.

E.g if I have a list of names and a checkbox next to each name, like this:

<div id="users">
 Bob smith <input type=checkbox />
</div>

And when a checkbox is clicked and the event handler function for it is called, I want to be able to identify which user was selected/unselected.

Ideally I'm looking for something like this:

<input type=checkbox data-userId = "xxx" />

Then when its clicked:

function handleClick()
{
  var userId = $(this).attr('data-userId');
}

However I'm looking to do this in a way that won't break my HTML validation, and would still be valid HTML and work in all browsers.

Any suggestions?