Search code examples
javascriptjquerywebkit

jQuery code works with Firefox but not webKit

I'm having a problem using jQuery: I have what I want with Firefox, but when I try it with webkit (Chrome, Opera...) it doesn't works. The idea of my code is to set all the <select> from a <form> in gray when the selected <option> is the value 0 (the first element of each <select>). When the <option> changes, the <select> has to go black. When you click on the 0 <option>, its text also changes from - to it's content="" text.
So it's okay with Firefox but not webkit, it's pretty annoying. You can see all my code in this JSFiddle and test it : my JSFiddle.
I think the problem comes from the use of $(this).parent() but I don't know how to avoid it.
Thanks

Solution

  • A little help for you:

    $("#pp").find("option").on("click", function() { ...

    The option itself does not fire a click event. Instead, use:

    $("#pp").find("select").on("click", function() { ...

    Therefore, you need to modify your inner lines by removing the parent() methods from your code since you are now listening to the parent directly.

    This should help you for the start ...