Stack Overflow: jQuery each function inside another jQuery each function to split out data to be used in the first each function

Looping through an array, using RegExp to isolate substrings and adding them to an element class

by ToddT

HTML

<article id="post-136" class="isotope-item">
    <div class="entry-content">
        <div class="ct-custom-field-block">
            <ul>
            <li>
                <span>Species:</span> Walnut Claro</li>
            <li>
                <span>Product Type:</span> Slab</li>
            <li>
                <span>Tag Number:</span> xxxx</li>
            <li>
                <span>PN:</span> xxxx</li>
            <li>
                <span>BF:</span> xx.xx</li>
            <li>
                <span>Weight (lbs):</span> xxx.xx</li>
            <li>
                <span>Width (in):</span> 25-42</li>
            <li>
                <span>Length (in):</span> 73-96</li>
            <li>
                <span>Depth (in):</span> 5</li>
            </ul>
        </div>
    </div> <!-- .entry-content -->
</article>

JavaScript

function prepareIso() {
    var pattern = new RegExp('^<span>.*</span>\s');
    // loop on each <article>
    $('article').each(function() {
        var classList = [];
        
        // the list of data I need for this article
        var data = $(this).find('.ct-custom-field-block ul');
        
        $(data).find('li').each(function() {
            var text = this.innerText;
            text = text.replace(/^.*:\s/, '');
            console.log(text);
            classList.push(text.toLowerCase().replace(' ', '-').replace('.', '_'));
        });
        
        $(this).addClass(classList.join(' '));
    });
};
                      
prepareIso();