CSS Selecting For Each

[Motoed-Work]

I have a segment of our search results where to code looks something like this

<div id="categoryBreadCrumbs">
<div class="criteria-header">Name of Category</div>
<div class="criteria-refinement">Category 1</div>
<div class="criteria-refinement">Category 2</div>
</div>

I have 2 data elements.
div#categoryBreadCrumbs div.criteria-header

div#categoryBreadCrumbs div.criteria-refinement

I have a rule that writes these two items to two different eVars. 
Trouble is... looking in debugger, it only reports Category 1 to the eVar for the refinement.  

I'm not seeing an easy way to do a "for each" style data element?
Is this possible to do or am I approaching it wrong?

[dwright · Accepted solution]

It sounds like you'd probably want to use a custom code data element that runs code using document.querySelectorAll(): https://www.w3schools.com/jsref/met_document_queryselectorall.asp