html loaded on a div is not recognized by jquery

Question

html loaded on a div is not recognized by jquery

Navigation

#1 by (0 votes)

0

I had a problem creating a web page, I do not know for what reason it happens I hope you can guide me to solve this problem

It happens that the page has an asynchronous load function using jquery on a div to get the html and load it into the div .ano.load, all right up there

The problem is that the content of the newly loaded div does not work any of the jquery functions that are already loaded on the page

this is my code

<script>
$( function() {
    $("#riesgo").click(function(event) {
        $( "#grilla" ).load( "prueba.php");
    }); 

    $( "#opener" ).on( "click", function() {
        alert ('hola');
    });

  });
</script>
<body>
    <button id="riesgo">cargar</button>
    <div id="grilla" align="center"></div>
</body>

the html that I charge in the div grid is:

<div>
  <p>prueba</p>
</div>

<button id="opener">probar jquery</button>

once the html is loaded the opener button does not work

can you help me solve this problem, what can you do so that the button that is loaded in the div works correctly?

thanks

javascript jquery html

asked by Alvaro vargas astorga 18.08.2017 в 17:22

source

1 answer

Error uploading an app to the IONIC Package with IOs platform I can not visualize with JSF

score 0 · Accepted Answer

This happens because the element with id opener does not exist when the page was first loaded, so to correct your problem you should use delegated events, that is, you must change your code to this:

$(document).on("click", "#opener", function() {
  alert('hola');
});