JSFiddle - React, Tailwind, and code Playground

by Wendy

HTML

<h2>Additional Information:</h2>

<div class="metafield_configuration">
    <div class="row">
        <p class="left">
            <label for="metafield_135">Birthday? (Just month and day. We&#x27;d like to help you celebrate!)</label>
            <br>
            <input type="text" name="subscription[metafields][135]" id="metafield_135" value="">
        </p>
    </div>
    <div class="row">
        <p class="left">
            <label for="metafield_1863">Where did you hear about us? (We&#x27;re curious!)</label>
            <br>
            <input type="text" name="subscription[metafields][1863]" id="metafield_1863" value="">
        </p>
    </div>
    <div class="row">
        <p class="left">
            <label for="metafield_6305">Unisex or Men&#x27;s (Choose one)</label>
            <br>
            <select name="subscription[metafields][6305]" id="metafield_6305">
                <option value="" selected>None</option>
                <option value="Unisex (for women and adventurous men)">Unisex (for women and adventurous men)</option>
                <option value="Men&#x27;s (traditionally masculine scents)">Men&#x27;s (traditionally masculine scents)</option>
            </select>
        </p>
    </div>
</div>

JavaScript

var field1 = $( ".metafield_configuration > .row:nth-child(1)" );
var field3 = $( ".metafield_configuration > .row:nth-child(3)" );
field3.insertBefore(field1)