title: jquery: replace inputs with spans
body: <p>I'm trying to replace inputs with spans containing the input values in such a way as to be able to switch them back upon clicking a button. I figure this would be most easily done in two stages - adding <code>&lt;span&gt;[input value]&lt;/span&gt;</code> in front of the inputs, and then hiding the inputs. The only problem is I'm having trouble with the first part. I'm trying things like </p>
  
  <pre><code>$('#container').find('input')
      .parent()
      .prepend('&lt;span&gt;&lt;/span&gt;') // this effectively creates: &lt;span&gt;&lt;/span&gt;&lt;input value=____&gt;
  </code></pre>
  
  <p>However, inside the prepend statement $(this) seems to be undefined, so I can't do</p>
  
  <pre><code>    .prepend('&lt;span&gt;'+$(this).children('input').val()+'&lt;/span&gt;')
  </code></pre>
  
  <p>Since there are several inputs, I can't simply put the input value into a variable. How would I do this?</p>