Question

I have a table as follows

<table>
    <tr>
        <td id="start">Starting Point<input type="button" value="start the test" onclick="get_the_next()" /></td>
    </tr>
    <tr>
        <td>not the right class - skip me</td>
    </tr>
    <tr class="concept1">
        <td>get me if you can!</td>
    </tr>
    <tr class="concept2">
        <td>but not me, I'm not the next</td>
    </tr>
    <tr>
        <td>not the right class - skip me</td>
    </tr>
</table>

I need to select row with class name “concept2”. How can I do that in JQuery?

Answer 1

jQuery(function($) {
    var row = $('.concept2');
});

To explain, the jQuery(function($) { ... }); attaches the callback (ie the “function”) to the DOM Ready event. This ensures your code only runs after the entire document had loaded.

The $('.concept2') uses jQuery’s CSS style selectors. In this case, it is using the class selector.

Update

To answer your comment, check out the manipulation category. An example might be

jQuery(function($) {
    $('tr.concept2').html('<td>new data</td>');
});

I suggest you get very familiar with the API.