JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container" id="cont">
    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">My Page Header</h1>
        </div>
    </div>
    <dl class="last">
            
<dt><label class="required"><em>*</em>Fabric Color</label></dt>
<dd>
    <div class="input-box">
        <select name="options[266]" id="select_266" class=" required-entry product-custom-option" title="" onchange="opConfig.reloadPrice()" style="position: absolute; top: -9999px;"><option value="">-- Please Select --</option><option value="3102" price="0">Black </option><option value="3103" price="0">White </option><option value="3104" price="0">Blue </option><option value="3105" price="0">Brown </option><option value="3106" price="0">Gray </option><option value="3107" price="0">Green </option><option value="3108" price="0">Khaki </option><option value="3109" price="0">Red </option></select>                                <div class="swatches-container"><img src="https://kiltailor.com/media/swatches/color-black.jpg" alt="Black " title="Black " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-white.jpg" alt="White " title="White " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-blue.jpg" alt="Blue " title="Blue " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-brown.jpg" alt="Brown " title="Brown " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-gray.jpg" alt="Gray " title="Gray " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-green.jpg" alt="Green " title="Green " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-khaki.jpg" alt="Khaki " title="Khaki " class="swatch-img"><img src="https://kiltailor.com/media/swatches/color-red.jpg" alt="Red " title="Red " class="swatch-img"></div></div>
</dd>
            
<dt><label class="required"><em>*</em>Waist Size (Inches)</label></dt>
<dd>
    <div class="input-box">
        <select...

JavaScript

$(document).ready(function () {
				var i = 1;
        var $el = $('dl');
        
        alert( $el.find( 'dt:nth-child(3)').html() );
        return;
        /*
        var $el1 = $('<div class="clss"></div>');
        $el1.append( $el.find( 'dt:nth-child(1)') );
        $el1.append( $el.find( 'dd:nth-child(1)') );
        */
        
        var $el2 = $('<div class="clss"></div>');
        $el2.append( $el.find( 'dt:nth-child(2)') );
        $el2.append( $el.find( 'dd:nth-child(2)') );
        $el2.append( $el.find( 'dt:nth-child(3)') );
        $el2.append( $el.find( 'dd:nth-child(3)') );
       
        /*
       var $el3 = $('<div class="clss"></div>');
        $el3.append( $el.find( 'dt:nth-child(4)') );
        $el3.append( $el.find( 'dd:nth-child(4)') );
        $el3.append( $el.find( 'dt:nth-child(5)') );
        $el3.append( $el.find( 'dd:nth-child(5)') );
				*/
       
        var $el4 = $('<div class="clss"></div>');
        $el4.append( $el.find( 'dt:nth-child(6)') );
        $el4.append( $el.find( 'dd:nth-child(6)') );
        
        $el.html('');
        $el.append($el1).append($el2).append($el3).append($el4)
        $el.find( 'div.clss').css({
        	'float': 'left',
        	'margin': '0px 10px 0px 0px',
        	'width': '45%',
        	'display': 'inline-block'
        });
    });