I'm having trouble getting my dropdown menu to still work after I empty it's contents and append new ones.
Here is the page I am having trouble with (try selecting a wallpaper resolution initially, then selecting a different wallpaper from the 5 at the top and try again): http://www.nba.com/warriors/wallpapertest_020.html
In $(document).ready I have:
$(".dropdown dd ul li a").click(function() {
var text = $(this).html();
$(".dropdown dt a span").html(text);
$(".dropdown dd ul").hide();
});
This works fine the first time around, but when I change up the contents of the dropdown, it stops working. Is there a way to recall the .ready() function to recognize the new additions? Or a better way to do this?
I also tried delegate() like so, but that stops it from functioning entirely:
$(".dropdown dd ul li").delegate('a', 'click', function() {
var text = $(this).html();
$(".dropdown dt a span").html(text);
$(".dropdown dd ul").hide();
});
Any assistance would be much appreciated :)
try using on()
$(".dropdown dd ul li a").on('click', function() {
var text = $(this).html();
$(".dropdown dt a span").html(text);
$(".dropdown dd ul").hide();
});
$(".dropdown dd ul li a").live('click', function() {
. I was under the impression that using live() is not good practice though.. - dougmacklin 2012-04-05 20:02
.live
was deprecated and replaced with .on
http://api.jquery.com/live - rgin 2012-04-05 20:03
jquery-1.7.2.min.js
, and .live
is supposed to be depreciated... but .on
is failing (in my case) while .live
is working - govinda 2012-07-14 00:12