Auto load iconate with yepnope and toogle icon using html attributes

Auto load iconate with yepnope and toogle icon using html attributes.

HTML

<i class="fa fa-bars fa-lg" data-iconate="tada" data-iconate-from="fa-bars" data-iconate-to="fa-arrow-right"></i>

JS

` $(document).on("click", "[data-iconate]", function(e){ e.preventDefault();

var $this = $(this), 
    from = $this.attr("data-iconate-from")||"",
    to = $this.attr("data-iconate-to")||"",
    animation = $this.attr("data-iconate")||"",
    isAnimating = $this.data("iconate-is-animating")||false;

if(isAnimating) return void(0);
//set true for animating
$this.data("iconate-is-animating", true);
//load and rum
yepnope({
    test: typeof iconate === "undefined",
    yep: ["http://bitshadow.github.io/iconate/dist/iconate.js", "http://bitshadow.github.io/iconate/dist/iconate.min.css"],
    complete: function(){
        iconate($this.get(0), {
            "from": from, 
            "to": to, 
            "animation": animation
        }, function() {
            $this
                .attr("data-iconate-to", from)
                .attr("data-iconate-from", to)
                .data("iconate-is-animating", false);
        });
    }
})

}); `