JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="product-grid">
    <li data-producttype="foo">product</li>
    <li data-producttype="bar">product</li>
    <li data-producttype="foo">product</li>
    <li data-producttype="foo">product</li>
    <li data-producttype="foo">product</li>
    <li data-producttype="bar">product</li>
</ul>

<select class="product-types">
    
</select>

JavaScript

$('.product-grid li').each(function(){
   thisdata = $(this).attr('data-producttype');
   $('.product-types').html("<option>" + thisdata + "</option>");
 });