FadeIn form not working in internet Explorer(tested 8) work well on ie(11)

Question

Here is my Html form

<form name="loginform" id="confirm_action" method="post" 
action="process_form.php" onsubmit="return validateForm(admincode ,adminpassword)"></form>

the property of form is set to hidden. on clicking this piece of code/image

 <a class="login" data-id="<?php echo $key['sub_Id'];?>" data-action="edit" href="#"><img src="images/edit_ico.png" alt="Edit" title="Edit"   border="0" /></a>

following jquery code runs on all other browsers Except IE(currently 8) but works on IE11

$('a.login').live('click', function(){
$("#box").fadeIn('slow');
$('form').fadeIn('slow');
$('#sub_id').val($(this).attr('data-id'));
$('#perform_action').val($(this).attr('data-action'));  

}) checked the error in scripts with developers tool which shows errors in the jquery files like this:
'jQuery' is undefined
'$' is undefined
Object doesn't support this property or method

complete fiddle at http://jsfiddle.net/messi1987/54rup/5/

help me out

Answer 1

First thing is:

jQuery 2.x has the same API as jQuery 1.x, but does not support Internet Explorer 6, 7, or 8.

Quoted from: http://jquery.com/download/#jquery-2-x

Try downgrading jQuery used on your site to 1.x.

Second thing is that old IE versions are much more sensitive to the quality of JavaScript code and you should scan your page with suich tools as for example JSLint, JSHint (community driven fork of JSLint) and others. Your code presented on JSFiddle gives quite a number of warnings and errors (unexpected whitespaces, missing semicolons, unnecessary semicolons, possibly undeclared variables). Fix them and rescan the code with code quality checking tools again.