Jack Torris
Jack Torris

Reputation: 804

IE8: jQuery append not working

jQuery append is working fine for all modern browser but for ie8 it is not working perfectly.

there is one issue. i want to append the hyperlink . it works perfectly but in IE it is not appending Hyperlink.

here is my code:

<div id="recent-posts-2" class="sidebar_wrapper widget_recent_entries widget">                 

    <div class="sidebar_title clearfix">

        <h3 class="fl widget-title">Recent Posts</h3>

    </div>

    <ul class="news_ul clearfix">

        <li>
            <span class="post-date">June 3, 2013</span>
            <a href="http://domain.com/wood/china-conference-optional-tours/">China Conference &amp; optional tours</a>

        </li>

        <li>
            <span class="post-date">March 8, 2013</span>
            <a href="http://domain.com/wood/hello-world/">Russia: Forest Industry Competitiveness &amp; Export Outlook</a>
        </li>

        <li>
            <span class="post-date">March 1, 2012</span>

            <a href="http://domain.com/wood/u-s-moulding-market-supply-options-outlook-to-2017/">U.S. Moulding Market &amp; Supply Options: Outlook to 2017</a>

        </li>

    </ul>
</div>
<script>
    jQuery(function() {

        jQuery('.widget_recent_entries .sidebar_title').append('<a href="<?php echo site_url(); ?>/news" class="fr news_more">more <i class="fa fa-arrow-circle-right"></i></a>');


    });

</script>

you can check this jsbin for iE8 it is not appending the hyperlink. need help.!

jsbin

Upvotes: 2

Views: 5556

Answers (1)

Tommy
Tommy

Reputation: 39807

You are missing the closing a tag in your jQuery.

</i></a>

Addtionally, IE11 (Edge mode), seems to choke on the jquery(document).ready type calls. However, changing to the shortcut method $(function(){code}); seems to work just fine. The javascript below has been tested and confirmed to work with Chrome, IE8+.

$(function(){  
  $('.widget_recent_entries .sidebar_title').append('<a href="<?php echo site_url();?>/news" class="fr news_more">more <i class="fa fa-arrow-circle-right"></i></a>');
  });

Lastly, keep in mind that jQuery 2.X only works with IE9 and higher (which was not the issue here, but a friendly reminder to those that may visit in the future).

http://jsbin.com/isAgEXAX/12/edit

Upvotes: 5

Related Questions