Replacing InnerHTML with replace()

I'm trying to replace some innerHTML of an element. My code below gets the innerHTML of container, converts it to a string, and tries to replace it. When I alert container before and after it was replaced - I get no changes. The innerHTML stays the same. Why doesn't the replace function work here? I suspect there may be a problem with my regex, but other than that I'm drawing a blank.

<div id = "container">
  <p id = "paragraph1">A paragraph</p>
  <p id = "paragraph2">A paragraph</p>
</div>
<script>
   var container = document.getElementById( 'container' ).innerHTML;
   container = container.toString();
   var paragraph1 = /<p id = "paragraph1">/;
  
   var newContainer = container.replace( paragraph1, '<p id = "newId">' )
   
   alert( container );
   alert( newContainer );
</script>

PS: I know there are other methods to change an elements ID, I'm experimenting with this way because I have over 1000 elements that need to be changed in my original program and its very slow changing all of those ids. So I'm trying to simply replace all of the innerHTML of one element instead of replace ids of 1000+.