JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<form name="pancettaForm" method="post" action="http://lizlantz.com/lcform.php" id="pancettaForm">
<input type="hidden" value="Pancetta Order Update" name="subject">
<input type="hidden" value="cookware/partners_10151_-1_20002" name="redirect">
<ul>
<li>
<label for="update-ship">I'd like to:</label>
<input id="ship-address" name="update-ship" type="radio" value="update-ship-address"/> Have pancetta shipped to a different address than my skillet<br />
<input id="ship-date" name="update-ship" type="radio" value="update-ship-date" /> Have pancetta shipped sooner than June 14, 2013 <br />
<input id="ship-both" name="update-ship" type="radio" value="update-both" /> Make changes to both the shipping address and shipping date
</li>
<li>
<label for="order-number"><em>*</em>Order Number (available in order confirmation email):</label>
<input type="text" name="order-number" class="required">
</li>
<li>
<label for="full-name"><em>*</em>Recipient Full Name:</label>
<input type="text" name="full-name">
</li>
<li id="address" style="display: none;">
<label for="address">
<em>*</em>Address
</label>
<input type="text"...
CSS
#pancettaForm ul{list-style-type: none; margin: 0; padding: 0;}
#pancettaForm ul li {display: block; margin: 25px 0 0 0;}
label.error {
color: red;
}
label.valid {
background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat
display: block;
width: 16px;
height: 16px;
}
JavaScript
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});
var $j = jQuery.noConflict(true);
$j(document).ready(function() {
$j('#pancettaForm').change(function () {
$j('#address,#new-ship-date').hide();
if ($j('#ship-address').prop('checked')) {
$j('#address').show();
}
else if ($j('#ship-date').prop('checked')) {
$j('#new-ship-date').show();
}
else if ($j('#ship-both').prop('checked')) {
$j('#address, #new-ship-date').show();
}
});
$j("#pancettaForm").validate();
});