How do I wrap two render array elements in a div? Given this renderable array:

$output = array(
    'twitter-icon' =&gt; array(
      '#type' =&gt; 'markup',
      '#markup' =&gt; '&lt;div class="twitter-icon"&gt;&lt;/div&gt;'
    ),
    'twitter-link' =&gt; array(
      '#type' =&gt; 'markup',
      '#markup' =&gt; l('follow us on Twitter', 'https://twitter.com/#!/zujava'),
    ), 
  );


How do I wrap both of these elements in a single DIV?
You can also use the #container form element, and code similar to the following one:

$wrapper = array(
  '#type' =&gt; 'container',
  '#attributes' =&gt; array(
    'class' =&gt; array('class-name'),
  ),
);

$wrapper['twitter-icon'] =&gt; array(
  '#type' =&gt; 'markup',
  '#markup' =&gt; '&lt;div class="twitter-icon"&gt;&lt;/div&gt;'
);

$wrapper['twitter-link'] =&gt; array(
  '#type' =&gt; 'markup',
  '#markup' =&gt; l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
); 


The #container element wraps its children elements with a &lt;div&gt; tag, whose CSS class is the one passed in the #attributes property.

You could even use a container for the "twitter-icon" element, but that doesn't give you any pro, except in the case you could possibly add an element to that, as with the following code:

$wrapper = array(
  '#type' =&gt; 'container',
  '#attributes' =&gt; array(
    'class' =&gt; array('class-name'),
  ),
);

$wrapper['twitter-icon'] =&gt; array(
  '#type' =&gt; 'container',
  '#attributes' =&gt; array(
    'class' =&gt; array('twitter-icon'),
  ),
);

if ($condition) {
  $wrapper['twitter-icon']['twitter-icon-text'] =&gt; array(
    '#type' =&gt; 'markup',
    '#markup' =&gt; t('Icon text'),
  );
}

$wrapper['twitter-link'] =&gt; array(
  '#type' =&gt; 'markup',
  '#markup' =&gt; l(t('follow us on Twitter'), 'https://twitter.com/#!/zujava'),
);