JavaScript DOM object to jQuery object

Question

How can I convert a JavaScript DOM object to a jQuery object?

<tr onclick="changeStatus(this)">

function changeStatus(myObject) {
       XXX.removeClass();
}

What should I write in place of XXX? I know I can make a workaround using an id and an id selector, but it is not so elegant. Is there any way to convert a js DOM object to a jQuery object or using the this keyword in jQuery?

Answer 1

var $this = $(myObject);

$this is a jQuery object. You can create jQuery objects from DOM elements.

<tr onclick="changeStatus(this)">

function changeStatus(myObject) {
       $(myObject).removeClass();
}

I would like to recommend doing your event binding with jQuery as well:

<tr class="change-status">

$('.change-status').on('click', function () {
    $(this).removeClass( ... );
});

This is nice because now all the JS code is in one place and can be updated (in my opinion) more easily. Note that the class I added to the <tr> element is not necessary if you want to bind to all <tr> elements in the DOM.

Answer 2

Simply wrap the pass the DOM object in as the first argument.

$(myObject).removeClass('foo');