etm124 etm124 - 6 months ago 14
HTML Question

jQuery click not firing when clicking image - hide/show table row

Trying to accomplish a pretty easy task. Click an image, and show a hidden table row. Here is the jquery:

$(".trigger_44870").click(function() {
alert('hi');
$("#target_44870").show();
});


Relevant HTML:

<tr>
<td colspan='13'><img src='https://feedback.primecaremedical.com:8887/purchasing/_assets/images/plus.png' width='1%' class='trigger_44870'></td>
</tr>
<tr style="display: none;" id='target_44870'>
<td colspan=13>Supporting Data</td>
<td colspan=13>Supporting Data</td>
</tr>


Whenever I click on the image, nothing gets fired from the jquery function.

Any ideas?

https://jsfiddle.net/o4aqbctn/4/

Answer

When $(".trigger_44870").click(...) is called, the image element with class="trigger_44870" isn't in DOM yet so the trigger fails.

Move your script code to the bottom of the page (before the </body>) or place it inside of an ondomready type event:

    $( document ).ready(function() {
      $(".trigger_44870").click( function(){
      alert('hi');
        $("#target_44870").show();
      } );
    });
Comments