jQuery: How can I get the class of a certain element that's inside another element?

Question

Lets say I have a table named unitTables with some rows. It is one of many similar tables on the webpage. In those rows is a class called selected , which I want to retrieve for a variable. The other tables on the page also use the selected class, so I need to retrieve this specific instance of selected .

In plain JavaScript, the way to find it is:

var table = document.getElementById('unitTables');
var selected = table.getElementsByClassName("selected");

What's the equivalent to the above two rows in jQuery?

I know I can rewrite the first row like this:

var table = $('#unitTables');

But I know I can't do the exact same thing to the next row, as I need to use to id of unitTables in order to get the specific selected row in that table. Currently I have:

var selected = from.$(".selected");

Which throws an Uncaught TypeError: from.$ is not a function. error, so I know that's not the correct syntax.

What's the best approach?

Answer 1

 var table = document.getElementById('unitTables'); var selected = table.getElementsByClassName("selected"); 

What's the equivalent to the above two rows in jQuery?

var selected = $("#unitTables .selected");

(Except selected will be a jQuery object around the matched set of elements, instead of a collection.)

The jQuery function ( jQuery or [usually] $ ) looks up elements via CSS selectors . So in this case, a descendant selector that looks for .selected within #unitTables .