Re-ordering Webform Component Descriptions

Webform is great but fails sometimes at some basic things. Like you want to display description before the field, YOU CAN'T!! seems stupid but it is like that. You can do some nasty jquery overrides or CSS if you can (put both as absolute position and move them). But to do this "DRUPAL WAY" you need to make a custom preprocess function for this in your theme. There is many debate about this in drupal community and we have a similar solution, a bit more smarter though as you can move description just for the field(s) you want.

You should add this function to template.php

http://api.drupalize.me/api/drupal/function/theme_webform_element/7

and then override it. Also if you don't want to have all description's before, but maybe just one. You should add this just above $output .= "</div>\n";

   if (!empty($element['#description']) && $variables['element']['#title']!='Reference') {
    $output .= ' <div class="description">' . $element['#description'] . "</div>\n";
  }

and this just above switch ($element['#title_display']) {

  if (!empty($element['#description']) && $variables['element']['#title']=='Reference') {
    $output .= ' <div class="description">' . $element['#description'] . "</div>\n";
  }

So now only one element with title 'Reference' is changed.
$variables['element']['#title']=='Reference'