jQuery- After append element in div hide/show not working -


i have problem hide/show element after append.

jquery code

var selector_conversation = $('#search-conversation');      var search_in             = $('.conversation');      selector_conversation.unbind('keyup').bind('keyup', function(){          var val = $(this).val();          search_in.hide();          var = 0;          $('.not-found').remove();          search_in.each(function(index, element){              var text = $(element).find('p.usr-msg-title').text();              if(text.tolowercase().indexof(val) >= 0){                  $(this).show();                  ++;              }else{                  //console.log('no')              }          });            if(i == 0){              $('<div class="user-msgs-box not-found" style="text-align: center">' + '<h3 >not found</h3>' + '<p>no people or conversations named ' + val + '</p>' + '</div>').insertafter('#search-form');          }      });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form id="search-form" action="" method="">              <input type="text" autocomplete="on" id="search-conversation" class="search" name="" size="20" maxlength="100" alt="" placeholder="search topics">              <a class="sicon" title="search" href="javascript:void(0);"></a>          </form>    <div class="conv-box" style="max-height: 783px;">  <div class="cursor_pointer usr-msg-item conversation active"       data-url="http://localhost/kinnect2/messages/kinnect-two-2/9" id="conv-9">      <div class="usr-msg-block">          <div class="usr-msg-img">              <a href="javascript:void(0)">                  <img alt="img"                       src="http://localhost/kinnect2/photo/8/145209077030568d2592729f77.46907077.jpg?type=image%2fjpeg">              </a>          </div>          <div class="usr-msg-content">              <p title="kinnect, ravi" class="usr-msg-title courser_pointer">                  ravi gowasker              </p>              <p class="usr-msg-txt">                  h              </p>          </div>      </div>      <p class="unread"></p>      <div class="usr-msg-timing">          28 minutes ago      </div>  </div>  <div class="cursor_pointer usr-msg-item conversation" data-url="http://localhost/kinnect2/messages/kinnect-two-2/3"       id="conv-3" style="display: block;">      <div class="usr-msg-block">          <div class="usr-msg-img">              <a href="javascript:void(0)">                  <img alt="img"                       src="http://localhost/kinnect2/photo/5001/14527741973056979335c44eb8.16760647.jpg?type=image%2fjpeg">              </a>          </div>          <div class="usr-msg-content">              <p title="kinnect, steave" class="usr-msg-title courser_pointer">                  apple              </p>              <p class="usr-msg-txt">                  how y               </p>          </div>      </div>      <p class="unread">      </p>      <div class="usr-msg-timing">          3 days ago      </div>  </div>  </div>

i using code. working fine before append new element after append new element not working on newly added element worked on old elements. suggestion resolve problem?

move search_in variable definition in function.

selector_conversation.unbind('keyup').bind('keyup', function(){     var search_in = $('.conversation');     //your code });     

Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -