javascript - jQuery Slide to right - and replacing HTML -

-

original html:

<div id="filler">     <h2 class="rankings-header">donor rankings <img src="<?php bloginfo('stylesheet_directory'); ?>/img/right_arrow.png" style="right:0; padding-left:10px; cursor:pointer;" id="dr_collapse"></h2> </div>

jquery:

jquery(document).ready(function($){          $("#dr_collapse").click(function(){             $("#rankings-list").toggle("slide",{direction:"right"},700);             $("#filler" ).html( '<h2 class="rankings-header">donor rankings <img src="/wp-content/themes/ati/img/left_arrow.png" style="right:0; padding-left:10px; cursor:pointer;" id="dr_collapse"></h2>' );         }); });

for reason, when click image, slide happens...once. , changes arrow image. can inspect html , see changed html.

but when click again, nothing happens , no js errors thrown

any ideas?

it's because you're replacing html #filler, dom element #dr_collapse being re-created, losing click event.

instead of $().click(), use event binder .on(), in way doesn't depends on inner dom element:

jquery(document).ready(function($){      $("body").on("click", "#dr_collapse", function(){         $("#rankings-list").toggle("slide",{direction:"right"},700);         $("#filler" ).html( '<h2 class="rankings-header">donor rankings <img src="/wp-content/themes/ati/img/left_arrow.png" style="right:0; padding-left:10px; cursor:pointer;"     id="dr_collapse"></h2>' );     }); });

jquery's .on() docs


Comments

Post a Comment

Popular posts from this blog

c# - HttpResponseMessage System.InvalidOperationException -

-
quite simple problem i've got easy solve reckon brains. it's tried different queries on google , nothing popped hey that's why here. here error: system.invalidoperationexception basically error thrown on piece of code here string test = response.content.headers.getvalues("location").firstordefault(); location in fiddler looks this: location: https://www.redirecturlishere.com/blah here entire function: private async task<string> getrequest() { //httpcontent postcontent = new stringcontent(post, encoding.ascii, "application/x-www-form-urlencoded"); using (httpresponsemessage response = await httpclient.getasync( "http://www.cant-share-url.com")) { using (httpcontent content = response.content) { string test = response.content.headers.getvalues("location").firstordefault(); } } return ""; ...
Read more

sql - Postgresql error: "failed to find conversion function from unknown to text" -

-
i have following postgresql query: ( select '201405mase04' testid, count(*) totq, count(distinct case when se1 = '' null else se1 end) totse, case when count(*)=0 7 else count(distinct rc) end totrc eivtestitems ti, eivtests t ti.test_id = t.test_id , t.test_type_id = 1 , t.test_id= '201405mase04' , ti.omit <> 1 ), b ( select '201405mase04' testid, count(*) totq eivtestitems ti, eivtests t ti.test_id = t.test_id , t.test_type_id = 1 , t.test_id= '201405mase04' , ti.omit = 1 ), c ( select '201405mase04' testid, count(*) totq eivtestitems ti, eivtests t ti.test_id = t.test_id , t.test_type_id = 1 , t.test_id= '201405mase04' , ti....
Read more