title: Find the multiple html tags in a div
body: <p>I want to replace my HTML texts that are wrapped by <code>em</code> and <code>u</code> tags.</p>
  
  <p>so for example:</p>
  
  <pre><code>&lt;div id='test'&gt;
  This is the test and &lt;em&gt; &lt;u&gt; texts here will need to be replaced &lt;/u&gt;&lt;/em&gt; to a link.
  &lt;/div&gt;
  </code></pre>
  
  <p>I want to make every word of <code>'texts here will need to be replaced' linkable</code>. so in my case it has sever <code>&lt;a&gt;</code> tags.</p>
  
  <p>My codes are</p>
  
  <pre><code>var texts = $('#test');
          texts.find('em u').each(function(){
          var text = $(this).html();
          $(this).replaceWith("&lt;a href='#' class='link' onclick='return false;'&gt;" + text + "&lt;/a&gt;");
      })
  </code></pre>
  
  <p>There are two issues of my codes.
  I can't seem to 'find' the texts under <code>&lt;em&gt;&lt;u&gt;</code> tag. if I change to <code>find('u')</code> it works.</p>
  
  <p>2.I want to have 7 a tags for my results so <code>'texts' 'here' 'will' 'need' 'to' 'be' 'replaced'</code> will be linkable. My codes only create 1 link for 7 words.</p>
  
  <p>Can anyone help me with it?</p>