Question

What is the practice to pass arguments from HTML to jQuery events function.
For example getting id of row from db:

<tr class="jq_killMe" id="thisItemId-id">
 ...
</tr>

and jQuery:

$(".jq_killMe").click(function () {
     var tmp = $(this).attr('id).split("-");
     var id = tmp[0]
     // ...
}

What’s the best practise, if I want to pass more than one argument?
Is it better not to use jQuery? For example:

<tr onclick="killMe('id')">
 ...
</tr>

I didn’t find the answer on my question, I will be glad even for links.
Thanks.

Edit (pre solution)

So you suggested two methods to do that:

1. Add custom attributes to element (XHTML)
2. Use attribute ID and parse it by regex
3. Attribute data-* attributes in HTML5
4. Use hidden children elements

I like first solution, but… I would like to (I have to (employer)) produce valid code. Here is a nice question and answers:
So what if custom HTML attributes aren't valid XHTML?

And the second is not so pretty as the first, but valid. So the compromise is…

The third is the solution for future, but here is a lot of CMS where we have to use XHTML or HTML4. (And HTML5 is the long process)

Answer 1

And what about nested elements?

<style type="text/css">
  .data {display: none}
</style>

<tr class="jq_killMe">
   <span id="data-id" class="data">my id</span>
   <span id="data-name" class="data">answer</span>
   ...
</tr>

But there is some questions:

• Is it this way safe as to accessibility?
• How percentage of users has disabled css?

Edit

Better way is to use <input type="hidden" />

<tr class="jq_killMe">
   <input type="hidden" name="data-id" value="my id" />
   <input type="hidden" name="data-name" value="answer" />
   ...
</tr>

and jQuery seems like this

$(".jq_killMe").click(function() {
    var id = $(this).children("input[name='data-id']");
    //...
});