Question

My site uses jQuery 1.4.2. The problem is .replaceWith() does not work in IE6 & IE7 in jQuery 1.4.2. Is there an alternate method that is supported by IE6 & IE7 in jQuery 1.4.2?

The fiddle is here: http://jsfiddle.net/8CEwf/1/

I know, it may not seem jQuery is attached to it, but if you look in the HTML, the jQuery is there since jsFiddle does not offer version 1.4.2

HTML:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<img src="/v/vspfiles/templates/cyberfront/images/buttons/btn_addtocart_small.gif">
<input type="image" src="/v/vspfiles/templates/cyberfront/images/buttons/btn_go_gray.gif">
<img src="/v/vspfiles/templates/cyberfront/images/Bullet_MoreInfo.gif">

Script:

$(document).ready(function(){
$('img[src="/v/vspfiles/templates/cyberfront/images/buttons/btn_addtocart_small.gif"]').replaceWith('<br /><span id="blackbutton" class="mediumbutton" style="display:block;">Add to Cart</span>');
$('input[src="/v/vspfiles/templates/cyberfront/images/buttons/btn_go_gray.gif"]').replaceWith('<input type="submit" class="graybutton smallbutton" name="Go" alt="Go" value="Go" title="Go">');
$('img[src="/v/vspfiles/templates/cyberfront/images/Bullet_MoreInfo.gif"]').replaceWith('<span class="learnmore">Learn More</span>');
});

Answer 1

$("element").after("text to replace element with").remove();

Example.

We just select the element we want to replace, add some text after it, and remove it from the DOM.

Assuming that this is for an “Add To Cart” feature on your website, and that all the inputs will have similar src attributes, then why dont’ you just add a class to them to make selection easier?