mouseevent - Chaning the cursor from “wait” to “auto” while the jquery performs a function -

i have jquery function generate qr codes , feeds these empty img tag. code works perfectly, problem takes several seconds generate code. so, need cursor show busy sign while function executing , return normal once generated code has been fed empty img tag complete.

my problem 2 fold.

question 1

i unable mouse change busy sign. tried using following css code no avail:

$('body').css({'cursor':'wait'}); 

question 2

how code know when qr code has been created , return browser normal? suspect best way around run check see when image tag has been fed values , return cursor normal.

i have enclosed code below:

the empty image tag:

<img id="qr-code-image"  src="" style="vertical-align: middle" />  

the jquery function:

 $('#link-types input[type=radio]').click(function() {   $('#qr-code-image').attr('src', '');  });    $('#link-types input[type=radio]').click(function() {    if (!$("input[class='link-selector-bespoke']").is(':checked')) {    var url = $('#link-flash').text();    $('body').css({'cursor':'wait'});   }   else   {    var url = $('#link-bespoke').text();   }            var encodedvalues  = jquery.base64encode(url);    var imgurl = '<?= $this->baseurl() ?>/scripts/qr/t/' + encodedvalues;   $('#qr-code-image').attr('src', imgurl);   $('body').css({'cursor':'default'});  }); 

use onload event callback function of image:

$('#qr-code-image').off('load').on('load',function(){      if(this.complete)           $('body').css({cursor:'default'}); }).attr('src', imgurl);