How to get children of each element in a collection?

How to get children of each element in a collection?

I have a form that allows user to add a dynamic/variable number of periods and each period can have a dynamic/variable number of intervals.

I want to be able to save to and reconstruct those from the database. I figured best way would be to save the number of intervals per each period.

I set up a codepen here:  http://codepen.io/bg17aw/pen/eBBzVo

Questions:
1) I know something about auto-iteration, collections, jquery objects, children() but not enough. When I do a $(".classname") is it more appropriate to say the result is a collection or a jquery object?

2) In my codepen, I am displaying (console.log) the number of periods, no problem, that is easy. However, now for each period I need to count the intervals and update the value of the input field "howmanyIntervals" that will be hidden in the final version. How can I do that?

3) Is there a better way to do all this, a better way to build the POST array?

4) I realise I could update the "howmanyIntervals" field each time a new interval is added or removed, however, it seems nicer to just parse and update them all at the time the SUBMIT button is pressed.

Thanks, and feel free to be critical of my approach, I am trying to figure out the best way, not just to solve the particular issue necessarily.