It's displaying `<label>` tags with the error messages as default behaviour, however the way my CSS is set up I need a div to wrap around the offending element and a message display in `<p>` tags.

Without errors, my html looks like this:

```html
<div class="grid-26 append-2">
  <p class="noMarginBottom">
    <label>First Name</label>
    <div class="jNiceInputWrapper">
      <div class="jNiceInputInner">
        <input type="text" class="text jNiceInput" name="name" />
      </div>
    </div>
  </p>
  <span class="clear" />
</div>
```

And with errors, it needs to look like this. Note the `div` with class `error` and the `<p>` tag.

```js
$(document).ready(function() {
  $("#contact_form").validate({
    rules: {
      name: {
        required: true
      }
    }
  });
});
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="grid-26 append-2">
  <div class="error">
    <p>Please write your real name</p>
    <p class="noMarginBottom">
      <label>First Name</label>
      <div class="jNiceInputWrapper">
        <div class="jNiceInputInner">
          <input type="text" class="text jNiceInput" name="name" />
        </div>
      </div>
    </p>
    <span class="clear" />
  </div>
</div>
```