jquery replaceWith for special html character

Question

On my page I have a star using:

    <div class="favorite">&#9734 </div>

On hover, I want to replace it with a filled in star. Here's the Jquery code I wrote:

    $(".favorite").hover(
        function(){
            $(this).replaceWith("★");
        },
        function(){

        }
    );

However, it never seems to work. This way it just shows me the text. Removing the quotes, it breaks. Any suggestions would help! I understand I could do this with a png but I'd rather not --- one less thing I need to have. Thank you!

Answer 1

use html() in jquery:

$(".favorite").hover(
        function(){
            $(this).html("★");
        },
        function(){
             $(this).html("☆");
        }
    );