New jQuery Plugin: Unique Element IDs

tl;dr I released a jQuery plugin for unique element ID generation. Get it at GitHub.

As anyone following me on Twitter will notice, I've been working with a lot of JavaScript recently and honestly, it's been a refreshing break, even if it has been straining at times.

Writing application UI code has its own set of unique challenges. The most important of these involves making sure the interface is usable and smooth. In JavaScript, this involves extensive use of element animation, and ensuring the effect doesn't hinder the user's experience, but enhance it.

I was writing a set of timers to execute at various intervals on a load of HTML elements. An obvious use of setTimeout() brought me to a semi-working implementation, but I started having issues when I needed the timeouts to cancel when certain events happened.

My solution was to put each timer into an array and pull out the correct timer reference when I needed it. However, to do this, I needed each element to have a unique ID. Since HTML IDs are unique, I could use in-page IDs, but I figured, "I can do this lazily and generate a new ID should I need one".

So, I came up with this little jQuery plugin that generates a unique ID for an element if and when you need it. Usage is like this:

$('.some_element_without_an_id').uid();

And it's that simple!

Get the code over at GitHub.