Javascript – JQuery Loop over JQueryObjects

javascriptjquery

I have a method, which will accept a parameter of a JQuery Object and will calculate totals for a section. So if you give it a JQuery Object of a div containing the section it will calculate a total for it

so you can do this:

var $totalcompletion = CalculateSectionCompletion(jQuery("#Section1"));

Now I have multiple divs with the class of section container. I want to be able to call the above method on any div with that class.

I'm doing this:

jQuery("div.SectionContainer").each(
function(i, valueOfElement){
CalculateSectionCompletion(valueOfElement);
});

The problem is the valueOfElement is actually the DOM object and not the JQuery Object, so I can't pass this in to my method.

Is there anyway I can loop through all JQuery Objects selected by a query, without writing some dirty code to extract the Id from the DOM object, and call JQuery(valueOfElement.id) and pass it in?

Best Solution

You can wrap any DOM element in $(..), as you do with $(document).

So I think you should be able to

jQuery("div.SectionContainer").each( function(i, valueOfElement){
  CalculateSectionCompletion($(valueOfElement));
});