jQuery Event Handling: Preventing Double Bindings

This post will show you how to deal with situations where event handlers are bound to elements more than once, causing multiple reactions when an event is triggered.

Two solutions will be covered:

  1. Using unbind() to clear previous bindings.
  2. Adding a class to the element after the first binding.

Consider the following snippet that binds a click event to a span tag. Depending on the placement of this snippet, two or more alerts may be spawned.

$("span").click(function () {