[jQuery] [HOWTO] Update IMG SRC after AJAX call?

[Fluffy Convict]

Using the following code in my CMS, I can grant or deny certain user
groups access to a certain page. In this example, usergroup #1 has
access to page #2. By clicking the image, the server will respond with
"role-1-2|icons/user-0.gif" (0 meaning "no access"). In the admin of
the site, I have many of these links underneath each other:

<a href="javascript:sendRequest('admin/page/ajax/1/2')">
  <img src="icons/user-1.gif" id="role-1-2">
</a>

The code that I'm using to update the image src (from icons/user-1.gif
to icons/user-0.gif), I'm using the following functions. My question
is: how could I accomplish the same with jQuery? Could anybody give me
some pointers, please? Your help is greatly appreciated!

function sendRequest(url) {
  http.open('get', url);
  http.onreadystatechange = handleResponse;
  http.send(null);
}

function handleResponse() {
  if (http.readyState == 4 && http.status == 200) {
    var response = http.responseText;
    var update = new Array();
    if (response.indexOf('|') != -1) {
      update = response.split('|');
      for (i = 0; i < update.length; i = i + 2) {
        updatePage(update[i], update[i + 1]);
      }
    }
  }
}

function updatePage(div, text) {
  var viewer = document.getElementById(div);
  if (viewer.nodeName == 'IMG') {
    viewer.src = text;
  }
  else {
    viewer.innerHTML = text;
  }
}