JQuery: in this case it is faster (.find) vs (.filter)

Question

I have a large table containing many rows (50-200) and columns (30). So in general I have at least 1,500 cells. I want to know which of the following instructions is faster and why?

//assuming we have some predefined variable var table = $('#myTable'); var allCells = table.find('td'); 

If the selected cell has a class of selected

 selectedCells = table.find('td.selected'); 

vs

 selectedCells = allCells.filter('.selected'); 

Or is there a better, native javascript way (in terms of performance and readability) to find the selected cells, given that you have 1500 cells to scroll through?

Answer 1

find() will be faster here because your filter() method relies on find() anyway. From your code:

 var allCells = table.find('td'); selectedCells = allCells.filter('.selected'); 

table.find('td.selected'); pulls only td elements with class selected .

table.find('td').filter('.selected') retrieves all td elements and then filters only elements of the selected class.