I'm having some trouble searching an d replacing an entire string of HTML. 

My example in this fiddle is me trying to replace an entire div tag with all of its classes and markup.

HTML:

```
<ul class="slides">
      <li><div class="flex-caption"><strong>Climb to the Top of Your Potential</strong>&nbsp;</div></li>
      <li><div class="flex-caption"><strong>Reach for the Clouds with Simple Solutions</strong>&nbsp;</div></li>
      <li><div class="flex-caption"><strong>Obtain the Courage to Suceed as a Leader, Team, & Company</strong>&nbsp;</div></li>
</ul>

```

JavaScript:

```
// This works perfect to search & replace text strings, but not for searching HTML:

jQuery(document).ready(function(){
function makeLink () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("Climb to the Top of Your Potential", "<div class='caption-align'>Climb to the Top of <a href='http://google.com'>Your Potential</a></div>");
});
}makeLink();
});

// Issue #1: This is my failed attempt to search & replace a large portion of the string:

jQuery(document).ready(function(){
function changeString () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("<div class='flex-caption'><strong>Reach for the Clouds with Simple Solutions</strong></div>", "<div class='flex-caption'><strong><div class='caption-align caption-right'>REPLACED TEXT! Reach for the Clouds with Simple Solutions</div></strong>&nbsp;</div>");
});
}changeString();
});

// Issue #2: I don't know why the character "&" is break this, so I tried \u0026 & both CDATA with no avail:

jQuery(document).ready(function(){
function changeString2 () {
jQuery(".flex-caption").html(function(i, str) {
return str.replace("<strong>Obtain the Courage to Suceed as a Leader, Team, \u0026 Company", "<i>Obtain the Courage to Suceed as a Leader, Team, \u0026 Company");
});
}changeString2();
});

```

<http://jsfiddle.net/LqkNE/>

As you can see, there are two little issues-- one with an ampersand that's causing me problems too.

What am I doing wrong?