Test 18 - Labels have no content

<div class="wrapper">
   <form action="#" method="post">
   <fieldset id="fs1">
      <legend class="formHeading">Profile Settings</legend>
      <p>
         <div class="label-wrapper"><label id="id1" for="uname"></label>User Name</div>
         <input id="uname" type="text" />
      </p>
      <p>
         <div class="label-wrapper"><label id="id2" for="pwd"></label>Password</div>
         <input id="pwd" type="password" />
      </p>
      <h3>Gender:</h3>
      <p>
         <input id="male" type="radio" name="sex" value="male" />
         <label id="id3" for="male"></label>Male
      </p>
      <p>
         <input id="female" type="radio" name="sex" value="female" />
         <label id="id4" for="female"></label>Female
      </p>
      <h3>Message Options:</h3>
      <p>
         <input id="get-pm" type="checkbox" value="getPM" />
         <label id="id5" for="get-pm"></label>Receive private messages from other users
      </p>
      <p>
         <input id="visible-online" type="checkbox" value="visible" />
         <label id="id6" for="visible-online"></label>Allow others to see when you are online.
      </p>
      <p>
         <br><label id="id7" for="sig"></label>Post Signature:<br>
         <textarea rows="5" id="sig" style="width: 25em;"></textarea>
      </p>
      <p>
         <div class="formSubheading"><label id="id8" for="theme-options"></label>Theme Options:</div>
      </p>
      <p>
         <select id="theme-options">
            <option value="default">Default Theme</option>
            <option value="dark">Dark Theme</option>
            <option value="blue">Blue Theme</option>
         </select>
      </p>
      <p>
         <input id="submit-bn" class="submitButton" type="submit" onclick="return false" value="Update Settings" />
      </p>
   </fieldset>
   </form>
</div>

div.wrapper {
  margin: 20px;
  padding: 10px;
  overflow: visible;
  background-color: #faf7f0;
  border: 1px solid #880000;
  -webkit-border-radius: 10px; /* Safari and Chrome rounded corners */
  -moz-border-radius: 10px; /* Firefox rounded corners */
  border-radius: 10px; /* Opera rounded corners */
}

fieldset {
margin: 10px 20px;
width: 40em;
}

.formHeading {
  font-weight: bold;
  font-size: 1.4em;
  padding-bottom: 10px;
}

.formSubheading {
  font-weight: bold;
  font-size: 1.17em;
  margin: 0;
  padding-bottom: 0;
}
div.label-wrapper {
   width: 6em;
   float: left;
}

input.submitButton {
  margin: 2px;
}

.focus {
  border: 3px solid #5ea3f1 !important;
}

$(document).ready(function() {

  $('input, textarea, select').focus(function () {
    $(this).addClass('focus');
  }); // end focus handler

  $('input, textarea, select').blur(function () {
    $(this).removeClass('focus');
  }); // end blur handler

}); // end ready