Question

I have the HTML given below:

<ul id='thumbsPhotos'>      <li src='/images/1alvaston-hall-relaxing-lg.jpg'  onclick='updatePhoto (this.title)'><img src='/images/1alvaston-hall-relaxing-sl.jpg'  width='56' height='56'></li>      <li onclick='updatePhoto(this.title)' src=''><img src='' width='56'  height='56'></li>      <li onclick='updatePhoto(this.title)' src=''><img src='' width='56'  height='56'></li> </ul> 

Now, I want to replace all the src in <li> tags not in <img> tags using InnerHTML. With this, my output will be:

<ul id='thumbsPhotos'>      <li title='/images/1alvaston-hall-relaxing-lg.jpg'  onclick='updatePhoto(this.title)'><img src='/images/1alvaston-hall-relaxing-sl.jpg'  width='56' height='56'></li>      <li onclick='updatePhoto(this.title)' title=''><img src='' width='56' height='56'></li>      <li onclick='updatePhoto(this.title)' title=''><img src='' width='56' height='56'></li> </ul> 

Answer 1

Not tested, but here’s a regex which might do it for you…

// find: <li ([^>]*)src='(.*?)'(.*?)>  // replace: <li $1title='$2'$3> 

Update: tested and it works on your example.

If you wanted to run this on the client side using Javascript (for whatever whacky reason), you could do this:

var ul = document.getElementById('thumbsPhotos'); ul.innerHTML = ul.innerHTML.replace(     /<li ([^>]*)src='(.*?)'(.*?)>/g,     '<li $1title='$2'$3>' );