I'm using JQuery and AJAX to load replace content in the website (for an HTML based game) instead of switching pages, which would stop music and animations that are playing. However, once the user clicks on a div with the class "d," the script for the div with class "f" no longer works. The same is true if the user clicks .f first; then .d no longer loads in the content anymore. How can I let these both (and many more in the future) work without canceling each other out? Do I need to use a loop? Or an if/else statement?
$(document).ready(function(){
//d
$(".d").click(function(){
$("#content").load("d.htm");
});
//f
$(".f").click(function(){
$("#content").load("f.htm");
});
});