"active" class is not applied to elements using javascript: in the href in jQTouch

Question

For some background, I've built a mobile Android app using PhoneGap for native functionality and jQuery with jQTouch as the UI framework. I have an a bunch of links (categories) in a <ul> which open the camera. The app "knows" which link was tapped so it knows which category the picture belongs to.

The issue I'm seeing is the .active class isn't applied to elements in jQTouch deemed to have an external link, of which javascript: is one. Does anyone have an idea on how to give the user some sort of indication which <li> he tapped before the camera opens so that he can cancel his action if he notices the .active class gets applied to an element that is different from what he expected?

Answer 1

For the sake of posterity, it seemed to be that jQTouch was adding and removing the .active class so fast that the UI wasn't able to keep up. Basically, it was added/removed so fast that no changes were detectable at all. It worked on a computer but not on the phone.

In order to remedy this, I used a setTimeout() function on the class removal functionality. I set it to 500 milliseconds. The list item now becomes active, fires the camera functionality (or any function you choose), and then removes the class 500 milliseconds later. Perfect!