Webform: how to wrap each form field with a div? Due to a design request, I need to add a DIV around each textfield/select field in my webform.

Since a webform is, both, a form and a node, I'm struggling to figure out how to do that.

In a normal form, I would use the hook_form_alter() and use the #prefix and #suffix attributes to add extra markup, but when printing out the webform in the hook to see the structure of the fields I can't see how to target each field.

Any help will be greatly appreciated!

Thanks.
You're correct in thinking to use the #prefix and #suffix attributes.  Webform components are stored in the 'submitted' part of the form array.  To add a surrounding div to each textfield and select, you can do the following in hook_form_alter:

if ($form_id == 'webform_client_my_form_id') {
  foreach($form['submitted'] as &amp;$field) {
    if($field['#type'] == 'textfield' || $field['#type'] == 'select') {
        $field['#prefix'] = '&lt;div class="my-div"&gt;';
        $field['#suffix'] = '&lt;/div&gt;';
    }
  }
}


To find out your form id, you can add a watchdog statement:

watchdog('My Module', "Form Id: $form_id");


Then check the dblog at /admin/reports/dblog.

This link may also be helpful: https://drupal.org/node/1558246