hi programmers in the code below i want to use font awesome in comment out put ,

storyReactionNum >= 4 ? comment = 'HOT <i class="fa fa-star" aria-hidden="true"></i>'

but the font awesome is display as text ,here is the full code 

<div class="comment-info"></div>

<script>
   var storyReactionNum = {{STORY_REACTIONS_NUM}};
   var comment;

   if ( storyReactionNum >= 2 ? comment = 'Trending <i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i>' : (
         storyReactionNum >= 6 ? comment = 'Super HOT!!!<i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i>' : (
                 storyReactionNum >= 5 ? comment = 'Extra HOT!!!<i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i><i class="fa fa-star" aria-hidden="true"></i>' : (
                         storyReactionNum >= 4 ? comment = 'HOT!<i class="fa fa-star" aria-hidden="true"></i>' : (
                                 storyReactionNum >= 1 ? comment = 'New!<i class="fa fa-star" aria-hidden="true"></i>' : comment = '1.0'
                        )
                )
        )
    ));

   $(".comment-info").text(comment);
</script>

am not good in javascript so can someone help me out ,just for the icon not to appear as text in code formart ,but let it display the icon
,just like it display normal in other ,thanks and regarsds

You're passing your comment string into the .comment-info div as text. You need it to render as HTML so instead try:
$(".comment-info").html(comment);