Loop through cloned inputs with same class

Question

I have a form with a set of input fields under class pblock. Each field has it's own class as well.

My users can clone the pblock class and add additional input fields. The structure ends up like this:

<div class="pblock"><!-- original input group-->
  <input class="fz-1">
  <input class="fz-2">
  <input class="fz-3">
</div>

Clone #1
<div class="pblock"><!-- 1st cloned input group-->
  <input class="fz-1">
  <input class="fz-2">
  <input class="fz-3">
</div>

Clone #2
<div class="pblock"><!-- 2nd cloned input group-->
  <input class="fz-1">
  <input class="fz-2">
  <input class="fz-3">
</div>
... etc

I can't figure out how to iterate through the sets of inputs and get each into an array of results.

I've tried this piece of code to run each time the clone method is called:

var fztext =    "Part designation: "+ $(".fz-1").val()+
                "\n\tLocation: "+$(".fz-2").val()+
                "\n\tBiopsy type: "+$(".fz-3").val()+"\n\n";
fz_part.push(fztext);

But I only get the original set of inputs, not the cloned inputs downstream. I'd like to keep each set of inputs grouped in the array, so I can call them back later.

Thanks!

Answer 1

$(".pblock").each(function(){
  var fztext = "Part designation: " + $(this).find(".fz-1").val() +
                "\n\tLocation: "    + $(this).find(".fz-2").val() +
                "\n\tBiopsy type: " + $(this).find(".fz-3").val() + "\n\n";
  fz_part.push(fztext);
});