Need to replace font for a particular word

Need to replace font for a particular word

by Thulasi Ram.S

HTML

<h1>
        Original Text
    </h1>
    <div id="replaceTest1">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>
    <h1>
        Original Text Replace ( global and case sensitive search in string )
    </h1>
    <div id="replaceTest2">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>
    <h1>
        Original Text Replace ( global and case insensitive search in string )
    </h1>
    <div id="replaceTest3">
        Hi.. testing <span style="font-family: Ebrima;">test aaaa</span>
        <div>
            <span style="font-family: Bookshelf Symbol 7; font-style: normal;">rreee AAAA </span>
            test
        </div>
    </div>

CSS

body
        {
            font-family: Batang;
            font-style: italic;
            font-weight: bolder;
        }

JavaScript

$(document).ready(function () {
            //$('body').replaceWith( $('<div></div>').append($(body).clone()).html().replace(/AAAA/g, '<span style="font-family: Arial; color:red;">AAAA</span>');


            //Or


            // global and case sensitive search in string
            $('#replaceTest2').replaceWith($('<div></div>').append($('#replaceTest2').clone()).html().replace(/AAAA/g, '<span style="font-family: Arial; color:red;">AAAA</span>'));
            // global and case insensitive search in string
            $('#replaceTest3').replaceWith($('<div></div>').append($('#replaceTest3').clone()).html().replace(/AAAA/gi, '<span style="font-family: Arial; color:red;">AAAA</span>'));
        });