title: Beautiful Soup 4: How to replace a tag with text and another tag?
body: <p>I want to replace a tag with another tag and put the contents of the old tag before the new one. For example:</p>
  
  <p>I want to change this:</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;p&gt;This is the &lt;span id="1"&gt;first&lt;/span&gt; paragraph&lt;/p&gt;
  &lt;p&gt;This is the &lt;span id="2"&gt;second&lt;/span&gt; paragraph&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>into this:</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  &lt;p&gt;This is the first&lt;sup&gt;1&lt;/sup&gt; paragraph&lt;/p&gt;
  &lt;p&gt;This is the second&lt;sup&gt;2&lt;/sup&gt; paragraph&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I can easily find all <code>spans</code> with <code>find_all()</code>, get the number from the id attribute and replace one tag with another tag using <code>replace_with()</code>, but how do I replace a tag with text <em>and</em> a new tag or insert text before a replaced tag?</p>