JSFiddle - React, Tailwind, and code Playground

by John Schulz

HTML

<form id="stepwizard" enctype="application/x-www-form-urlencoded" method="post" action="/admin/Videos/publish/create">
    <dl class="zend_form">
    <dt id="choosevideobutton-label">&nbsp;</dt>
        <dd id="choosevideobutton-element">
            <button name="choosevideobutton" id="choosevideobutton" type="button" onclick="alli.assetbin.videoPopup(alli.allitv.fetchVideo);">Choose Video</button>
        </dd>
        <div id="videos" class="step">
            <dt id="video-label">&nbsp;</dt>
            <dd id="video-element">
                <input type="hidden" name="video" value="" id="video" />
                <p class="description">
                    <div class="img" id="video_image">No Video Chosen</div>
                </p>
            </dd>
        </div>
        <div id="tour_assoc" class="step">
            <dt id="tours-label">
                <label for="tours" class="optional">Tours</label>
            </dt>
            <dd id="tours-element">
                <label for="tours-1">
                    <input type="checkbox" name="tours[]" id="tours-1" value="1" />Gatorade Free Flow Tour</label>
                <br />
                <label for="tours-2"><input type="checkbox" name="tours[]" id="tours-2" value="2" />Dew Tour</label>
                <br />
                <label for="tours-3"><input type="checkbox" name="tours[]" id="tours-3" value="3" />King of Wake</label>
                <br />
                <label for="tours-4"><input type="checkbox" name="tours[]" id="tours-4" value="4" />Motocross Championship</label>
            </dd>
            <dt id="tour_instace_1-label">
                <label for="tour_instace_1" class="optional">Tour Instances</label>
            </dt>
            <dd id="tour_instace_1-element">
                <label for="tour_instace_1-9"><input type="checkbox" name="tour_instace_1[]" id="tour_instace_1-9" value="9" />A shameful Tour</label>
                <br />
                <label...

JavaScript

var $tour_instances = $('dt[id^=tour_instace_], dd[id^=tour_instace_]'),
    $tours = $('#tours-element :checkbox');

$tour_instances.hide();
$tours.bind('change', function (e){ 

    var instance_id = parseInt(this.id.match(/\w$/)[0]),
        $instance_els = $('#tour_instace_' + id + '-label' +', '+
                          '#tour_instace_' + id + '-element' + ', '
                         );
    if (this.checked){