Damit die Funktion jquery .on mit AJAX-geladenen Inhalten funktioniert

Ich habe Probleme, eine .on-Klick-Funktion für AJAX-geladene Inhalte zu erhalten.

Ich habe bereits mit der jquery .live gearbeitet, aber dies ist das erste Mal mit .on und ich verstehe, dass sie genau so funktioniert. Unsicher, warum ich Probleme habe.

Unten finden Sie den HTML-Code, der das Element angibt, auf das Sie klicken

<code>    <h1>Press &amp; Media</h1>
    <div id="back"></div>
    <div id="overlay-content">
        <span id="edocs" class="tab"></span>
        <span id="news" class="tab"></span>
        <span id="partners" class="tab"></span>
    </div>
</code>

Unten ist die Funktion, die den AJAX-Inhalt lädt.

<code>    $("#overlay-content").on('click','#news',function() {
        var active = 1;
        $("#loading").show();
        $("#overlay-content").fadeOut(1000, function() {
            $.get("http://<? echo ROOT; ?>includes/functions.php", { pressmediaNews: active }, function(data) {
                $("#loading").hide(400);
                $("#overlay-content").empty().append(data).fadeIn(1000);
            });
        });
    });
</code>

Dies sollte das folgende HTML laden

<code>    <div id="news-left-panel">
        <h4>News Section</h4>
        <ul>
            <li id="newsID2" class="newsYear">
                <p>2012</p>
                <ul class="newsMonths" style="display:none">
                    <li>Jan
                        <ul class="newsArticles" style="display:none">
                            <li onClick="newsID(2)">test</li>
                        </ul>
                    </li>
                    <li>Feb</li>
                    <li>Mar</li>
                </ul>
            </li>
            <li id="newsID1" class="newsYear">
                <p>2011</p>
                <ul class="newsMonths" style="display:none">
                    <li>Dec
                        <ul class="newsArticles" style="display:none">
                            <li onClick="newsID(1)">Test</li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</code>

Jetzt wird der obige Code einfach nicht ausgeführt, es werden Fehler usw. im Firebug angezeigt.

Also bin ich ein bisschen verloren, warum es nicht ausgeführt wird, der alert () wird sogar nicht ausgeführt.

Antworten auf die Frage(7)

Ihre Antwort auf die Frage