JSFiddle - React, Tailwind, and code Playground

HTML

<select class='quantity' onchange='quantChange()' id='bwoo-1'>
    <option value=0>0</option>
    <option value=1>1</option>
    <option value=2>2</option>
    <option value=3>3</option>
    <option value=4>4</option>
    <option value=5>5</option>
    <option value=6>6</option>
    <option value=7>7</option>
    <option value=8>8</option>
    <option value=9>9</option>
    <option value=10>10</option>
</select>

<form action="/order-now/a-la-carte/?add-to-cart=187" class="cart-nonmealplan" method="post" enctype="multipart/form-data">
    <button type="submit" id="p187" data-product_id="p187" data-product_sku="" data-quantity="1" class="add_to_cart_button button product_type_simple">Add to cart</button>
</form>

<script>
function quantChange() {
    d = document.getElementById("bwoo-1").value;
    console.log(d);
    document.getElementById("p187").setAttribute('data-quantity',d);
}    
</script>