Icon jQuery

by Liam Merlyn

HTML

{tag_addtofavorites,<img alt="" src="http://radshaperc.businesscatalyst.com/_System/img/star-o.png" style="min-width:18px;">,
<img alt="" src="http://radshaperc.businesscatalyst.com/_System/img/star.png" style="min-width:18px;">}
<hr>
This is what I'd like to be:<br>
    {tag_addtofavorites,<i class="fa fa-heart"></i>,<i class="fa fa-heart-o"></i>}

CSS

<link href="http://radshaperc.businesscatalyst.com/_System/css/awe-icon.css" rel="stylesheet" integrity="sha256-k2/8zcNbxVIh5mnQ52A0r3a6jAgMGxFJFE2707UxGCk= sha512-ZV9KawG2Legkwp3nAlxLIVFudTauWuBpC10uEafMHYL0Sarrz5A7G79kXh5+5+woxQ5HM559XX2UZjMJ36Wplg==" crossorigin="anonymous">

JavaScript

var loggedin = {
    module_isloggedin
};


jQuery(document).on('click', '.favoritelink', function (e) {
    e.preventDefault();

    var $el = jQuery(this);

    if (jQuery(loggedin == 1).length > 0) {
        jQuery.ajax({
            url: $el.attr('href'),
            cache: false
        });

        var addImage = "radshaperc.businesscatalyst.com/_System/img/star-o.png",
            removeImage = "radshaperc.businesscatalyst.com/_System/img/star.png",
            img = $el.find('img');

        if (img.hasClass('fav-add')) {
            img.attr('src', removeImage).removeClass('fav-add').addClass('fav-remove');
            $el.attr('href', $el.attr('href').replace('FavoriteProcess.aspx?', 'FavoriteProcess.aspx?A=Remove&'));
        } else {
            img.attr('src', addImage).removeClass('fav-remove').addClass('fav-add');
            $el.attr('href', $el.attr('href').replace('A=Remove&', ''));
        }

    }
});