Li Wen
Li Wen

Reputation: 43

how to append icon in social menu bar

I tried to append social icon to the drop-down menu bar, but i dont know why my code doesn't work

Can anyone help me?

<script>
$(document).ready(function(){

    $("li.has-dropdown:eq(6) ul.dropdown li a").each(function(){
        var thisText = $(this).text();

         if( thisText=="Facebook"){
            $(this).prepend("<i class="fa fa-facebook-square fa-2x"></i>");
         };
          if( thisText=="Twitter"){
            $(this).prepend('<i class="fa fa-twitter-square fa-2x"></i>');
         };
         if( thisText=="Youtube"){
            $(this).prepend('<i class="fa fa-youtube-square fa-2x"></i>');
         };
         if( thisText=="Googleplus"){
            $(this).prepend('<i class="fa fa-google-plus-square fa-2x"></i>');
         };
        if( thisText=="Printerest"){
            $(this).prepend('<i class="fa fa-pinterest-square fa-2x"></i>');
         };
         if( thisText=="Instagram"){
            $(this).prepend('<i class="fa fa-instagram fa-2x"></i>');
         };
    });
});
</script>

thank you guys i target the wrong dropdown.now it works

Upvotes: 1

Views: 70

Answers (2)

Darren
Darren

Reputation: 70728

You are escaping your quotes.

You need to use a singular quote when using prepend and a double quote " when you apply the class elements.

For example:

$(this).prepend('<i class="fa fa-facebook-square fa-2x"></i>');

http://jsfiddle.net/dsbx5b5g/1/

Upvotes: 1

Alesfatalis
Alesfatalis

Reputation: 777

"<i class="fa fa-facebook-square fa-2x"></i>" here you are using " instead of '

change it to: '<i class="fa fa-facebook-square fa-2x"></i>' to prevent errors

Upvotes: 0

Related Questions