title: wrapping elements (and arrays of elements) with jQuery
body: <h3>Short form:</h3>
  
  <p>How would you implement something like the following in jQuery?</p>
  
  <h3>Details:</h3>
  
  <p>I have a pair of pure javascript functions that wrap HTML elements; it does what I need:</p>
  
  <pre><code>&gt; wrap_element('li', 1)
  '&lt;li&gt;1&lt;/li&gt;'
  &gt; wrap_row('ul', 'li', [1, 2, 3])
  '&lt;ul&gt;&lt;li&gt;1&lt;/li&gt;&lt;li&gt;2&lt;/li&gt;&lt;li&gt;3&lt;/li&gt;&lt;/ul&gt;'
  </code></pre>
  
  <p>But as a newcomer to jQuery, I'm certain there's a more elegant and idiomatic way to do something equivalent using jQuery.  Can you enlighten me?</p>
  
  <hr>
  
  <p>For reference, here's my pure javascript implementation:</p>
  
  <pre><code>function wrap_element(tag, el) {
    return '&lt;' + tag + '&gt;' + el + '&lt;/' + tag + '&gt;';
  };
  function wrap_row(row_tag, col_tag, cols) {
    var wrapped_cols = cols.map(function(col) {
      return wrap_element(col_tag, col)});
    var row = wrapped_cols.reduce(function(col, accum) {
      return col + accum; });
    return wrap_element(row_tag, row);
  };
  </code></pre>