getting access to dom elements from inserted html with jquery

Question

I want to get access to DOM-Elements which are added with jquery from an external HTML-File.

Here's my first part of the code where I add the HTML:

$.get("resources/game/game_menu.html").success(function(data) {
    $("#gameView2").html(data);
});

the "game_menu.html" looks just like this (atm for testing)

<div id="gameMenu" class="gameMenu">
    <button id="startGame" type="button">Click Me!</button>
</div>

Now I'm trying to get access to the elements with jquery which looks like this:

$("#startGame").click(startGame());
$("#gameMenu").someFunction(someContext);

But both just don't work. How is possible to get access to ALL of the DOM-Elements. Can anyone help me?

Thx, myr0

Where do you put the last two commands? Can you show the whole code please? — , May 20 '16 at 16:20

score 1 · Accepted Answer · edited May 23 '17 at 11:52

1

You need to use $(document).on("click", "#startgame", startGame()); for dynamically generated content.

edited May 23 '17 at 11:52

Community

answered May 20 '16 at 16:24

Matt Solarz

1

`$(document).on("click", "#startgame", startGame);` – Alex Kudryashev May 20 '16 at 16:30
`$(document).on("click","#startGame", function(){ startGame() });` this fixed it! thx! – myr0 May 20 '16 at 16:39
Alex is right, you can just pass in startGame instead of function() { startGame() }, but the way you've done it should be fine as well. – Matt Solarz May 20 '16 at 17:05

score 0 · Answer 2 · answered May 20 '16 at 16:29

0

Define the event inside

$.get("resources/game/game_menu.html").success(function(data) {
    $("#gameView2").html(data);
    $("#startGame").click(startGame());
});

Those elements not exist in DOM.

answered May 20 '16 at 16:29

Omar Vega

`startGame` shouldn't have `()` I think, as it's a callback. – Soubhik Mondal May 20 '16 at 16:36

2 Answers2