How to Find and Replace HTML Tags attribute by using jquery?

Question

I want to find and replace a tag attribute or change inline css by using Jquery.

For Example : <span style="text-decoration: underline;">

I want to find inline style<span style="text-decoration: underline;"> and replace it to <span class="line"> this on page load.

Answer 1

Check this DEMO : https://jsfiddle.net/yv5apdaj/

You can do like this, update the css style according to your need.

In this way, you still can use other styles and remove the desired css style only.

JQUERY

$(document).ready(function(){
    $('span').each(function(){
        if($(this).css('text-decoration') === 'underline'){
            $(this).css({'text-decoration':''});
            $(this).addClass('line');
        }    
    });
});

HTML

<span style="text-decoration: underline;">Test Content</span><br /><br />
<span style="text-decoration: underline;">Test Content</span>