Href is not working in IE8

Question

I am generating an HTML dynamically and appending the response to A DIV .

Here is the generated html in jQUery

    {% elif topic|length < 1 or topic.user_exhausted_attempts %}
        $('.questionHolder').hide();
        var html = '<section class="span9">';
        html += '<div class="quiz-wrapper span12  questionHolder quiz-complete">';
        html += '<h2>Thank you for completing the Assessment.</h2>';
        html += '<br/><br/>';
        html += 'A unique learning plan has been created for you based on your responses to the Assessment.';
        html += '<br/><br/>';
        html += '<a href="{% url elearning.todolist %}" class="btn btn-primary roleplay-btn">Back to To Do</a>';
        //html += '<button onclick="javascript:window.document.location=\'{% url elearning.todolist %}\'" class="btn btn-primary roleplay-btn">Back to To Do</button>';
        {% if topic|length < 1 %}
            {% if show_submit %}
                html += '&nbsp;<button id="coursesubmit" onclick="resubmit()" class="btn btn-primary" style="margin: 5% auto;width:40%;">Submit</button>';
            {% endif %}
            {% endif %} 
        $(".responseHolder").html(html);
    {% endif %}

But when I am clicking on the Back to TODO button in IE8 the button is unresponsive .

Above code is working fine in chrome and firefox .

Please tell me what do so that it could start working

<section class="span9">
    <div class="quiz-wrapper span12  questionHolder quiz-complete">
        <h2>Thank you for completing the Assessment.</h2>
        <br/>
        <br/>
        A unique learning plan has been created for you based on your responses to
        the Assessment.<br/>
        <br/>
        <a href="/eLearning/todo-list/" class="btn btn-primary roleplay-btn">Back to To Do</a>

Answer 1

I think it might be CSS issue. As in other browsers it working fine, That means there is no syntax error there. In IE8 may be other elements padding, margin affecting or overriding 'To do' button. You can check it in IE8 development tool.

Also you can cross verify with IE9 or IE10 (Microsoft resolved most of the browser errors in advance versions), If code is working fine in these browsers then there is definitely a CSS issue.

Answer 2

I might be too late in answering this, and you would have got your problem sorted. nevertheless

I guess the problem is when u use "section" does not work in ie8 but ie9+, you have to either change the code or else you can you modernizr.js which includes the hack to get ie8 to understand this tag.

download the js and include in you html. this should sort out this issue