Forms remove table

by Ryan Perez

HTML

<table class="webform" cellspacing="0" cellpadding="2" border="0">
  <tr>
    <td>{module_ccsecurity}</td>
  </tr>
  <tr>
    <td>
      <label for="CAT_Custom_461647">Your Name</label>
      <br />
      <input type="text" maxlength="4000" name="CAT_Custom_461647" id="CAT_Custom_461647" class="cat_textbox" />
    </td>
  </tr>
  <tr>
    <td>
      <label for="EmailAddress">Email Address <span class="req">*</span>
      </label>
      <br />
      <input type="text" name="EmailAddress" id="EmailAddress" class="cat_textbox" maxlength="255" /> </td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="CampaignList_73116" />Subscribe to: Bow Tie Kreative</td>
  </tr>
  <tr>
    <td>
      <input type="checkbox" name="CampaignList_73117" />Subscribe to: Hustle Zone TV</td>
  </tr>
  <tr>
    <td>
      <input class="cat_button" type="submit" value="Submit" id="catwebformbutton" />
    </td>
  </tr>
</table>

<div class="code">
</div>
<div class="input-checkbox">

CSS

xmp {
  white-space: normal;
}

table {
  width: 100%
}

JavaScript

$('table').wrap('<form class="form-code"></form');
$('input[type="checkbox"]').each(function() {

  $(this).parent().contents()
    .filter(function() {
      return this.nodeType !== 1;
    }).wrap("<span></span>");
  $(this).parent().children('label:first').remove();
});


$('.webform br').each(function() {
  $(this).remove();
});


$('.webform input').each(function() {
  $(this).unwrap().unwrap();
});
$('span').each(function() {
  $(this).remove();
});

$('tr').each(function() {
  $(this).unwrap();
});
$("td").contents().unwrap().unwrap();
$("input[type='text']").each(function(index, elem) {
  var eId = $(elem).attr("id");
  var label = null;
  if (eId && (label = $(elem).parents("form").find("label[for=" + eId + "]")).length == 1) {
    $(elem).attr("placeholder", $(label).html());
    $(label).remove();
  }
});
$('p').unwrap();
$('input').unwrap();
var data = $('.form-code').html();

$(".code").html("<xmp>" + data + "</xmp>");