We won't need to specify the skill class, only the html class. One thing to note is the difference between,
In the first, the element has both classes, as in,
<element class="classa classb"></element>
The second is a classa element with classb descendants. Very important to note this distinction.
Still reviewing. Expect this post to be edited further.
Remove all the alerts from your code. This was only for show in the early goings. We would not want alert() in our production code unless for very good reason. JS dialogs interrupt asynchronous program flow. In other words, the program stops dead in its tracks when a dialog is open.
class names rarely contain uppercase, and that is the case here. jquery.
My code has one extra click handler that yours does not. Have you reviewed all the instructions from the beginning to be sure your code is complete?
I didn't notice that in the HTML, before. It seems more like a mistype than deliberate. There is not jQuery class in the CSS. I changed the HTML and ran it again with no problem. Better that everything be lowercase, as mentioned earlier.