Home/ Questions/Q 8050601
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T07:07:20+00:00

index.php: <html> <head> <script type=text/javascript src=script.js></script> </head> <body> <div id=box></div> <div onclick=getContent()>Open Window</div> </body>

  • 0

index.php:

<html>
    <head>
        <script type="text/javascript" src="script.js"></script>
    </head>
    <body>
        <div id="box"></div>
        <div onclick="getContent()">Open Window</div>
    </body>
</html>

script.js:

function getContent() {
    //ajax call that returns the html from content.php and places it in the box div
}
function sayHello() {
    console.log('Hello');
}
function sayGoodBye() {
    console.log('Good Bye');
}

content.php:

<div onclick="sayHello()">Say Hello</div>
<div onclick="sayGoodBye()">Say Good Bye</div>

What is the correct way to make the functions sayHello() and sayGoodBye() work?
Currently they do nothing.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As your element comes from ajax and append to #box dynamically, so you need an delegate event handling.

    $('#box').on('click', '#newElement', function() {

});

    Syntax for delegate of .on() is:

    $(container).on(eventName, target, handlerFunction);

    To trigger you need to use

    $('#box div').eq(0).click(); // sayHello()

$('#box div').eq(1).click(); // sayGoodBy()

    NOTE

    I think it should work normally

    Look here

    And its also possible to trigger those click events

    Check this

    • 0