Question

<script type="text/javascript">
$("a.filef").click(function(e){
    alert('hi, it works');
    return false;
});

</script>


<a class="filef" href="" rel="1">A</a>
<a class="filef" href="" rel="2">V</a>

Answer 1

You need to make sure the elements exist first. Try this instead:

$(function(){
  $("a.filef").click(function(e){
    e.preventDefault();
    alert("Hi, it works.");
  });
});

Placing your code within:

$(function(){
  /* here */
});

Causes it to wait until the DOM is finished loading before it runs. In your case, it waits until the links exist before it attempts to bind logic to them.

In some scenarios you will need to run the code before the object exists. This is the case with many ajax-enabled websites. In those cases, jQuery has the $.live() method, which is of a similar look:

$(function(){
  $("a.filef").live("click", function(e){
    e.preventDefault();
    alert("Hi, it works.");
  });
});

Using this, it doesn’t matter if the elements already exist, or will show up sometime in the future. Unless you’re working with ajax or late-created elements, I would suggest sticking with the first solution.