JQuery: Help with $("#div")

Question

I just started using JQuery, as such, I'm cleaning up old code of mine to use JQuery throughout.

Question: How would I convert the following code to use JQuery?

// enable the other link
document.getElementById("asc").setAttribute("href", "#");
document.getElementById("asc").onclick = function() {displayHomeListings("asc")};
document.getElementById("asc").style.textDecoration = "none"

//disable this link
document.getElementById("desc").removeAttribute("href");
document.getElementById("desc").onclick = "";
document.getElementById("desc").style.textDecoration = "underline"

Answer 1

$("#asc").attr("href", "#")
         .css("text-decoration", "none")
         .click(function(e) {
              e.preventDefault();
              displayHomeListings("asc");
              return false;
         });

$("#desc").removeAttr("href")
         .css("text-decoration", "underline")
         .unbind("click");

Answer 2

$('#asc').attr('href', '#').click(function() {
    displayHomeListings('asc');
}).css('text-decoration', 'none');

You can figure out the other one, although I would generally advise to addClass and removeClass instead of messing with CSS styles directly. You also wouldn't need to mess with the href if you simply return false; inside the click function while leaving the href in the actual HTML to be something that degrades gracefully.

Answer 3

$('#asc').attr('href', '#').click(function() {
  displayHomeListings('asc');
  return false;
}).css('text-decoration', 'none');

$('#desc').attr('href', '').unbind('click').css('text-decoration', 'underline');

Though, assuming the #desc href was set to '#', you don't really need to clear that one.

Answer 4

$('#asc').attr('href','#');
$('#asc').click(function() {displayHomeListings("asc")});
$('#asc').css('text-decoration','none');

$('#desc').attr('href','');
$('#desc').unbind('click');
$('#desc').css('text-decoration','underline');