title: Jquery: My class does not function during second call
body: <p>I am new to jQuery.just learn and use it for 3 weeks until now.
  I have written a class to organize stuff.
  I call my method with more than 2 events,but the event does not work during my trigger of the second event.
  there's nothing wrong with the selector.
  I think there's something missing in my class. I don't know.
  please help!
  here's the snippet:</p>
  
  <pre><code>$("#btnPersonalNext, #btnDocListBack, #pDocList").livequery('click',function()
  {
    var docListContent = 'loadDocumentList.php';
    $("#contentpaper").addContent(
    {
      _tag:'div',
      _id: 'contentDocList',
      _class: 'content',
      _content: docListContent,
      _heading: 'Document List'
    });
    //store personal info in session:
  });
  </code></pre>
  
  <p><code>addContent()</code> is the function.
  when I click <code>#btnPersonalNext</code>,this works, but for <code>#btnDocListBack</code>, not any-more.</p>
  
  <p>here's  my class (<code>jquery.content.js</code>). what it does is load html into a certain <code>_tag</code> with a particular <code>_id</code>.</p>
  
  <pre><code>(function($)
  {
    $.fn.addContent = function(options)
    {
      var defaults = {
        _tag: 'div',
        _id: '',
        _class: '',
        _content: '',
        _heading: '',
        _clearExisting:'yes',
        _insertAfterID:'',
        _deleteBeforeInsert:'no'
      };
      var options = $.extend(defaults, options);
  
      return this.each(function()
      {
        obj = $(this);
        if(options._clearExisting=='yes'){
          obj.empty();
        }
        if(options._deleteBeforeInsert =='yes'){
          $('#'+options._id).remove();
        }
  
        var innerHtml = '&lt;' + options._tag + ' id="' + options._id + '" class="' + options._class + '"&gt;';
        if(options._heading!=''){
          innerHtml += '&lt;h2&gt;' + options._heading + '&lt;/h2&gt;';
        }
  
        if(/^[A-Za-z0-9]+\.php(\??([A-Za-z0-9]+=[A-Za-z0-9]+)(&amp;[A-Za-z0-9]+=[A-Za-z0-9]+)*)?$/.test(options._content))
        {//if .php
          $.get(options._content,function(data)
          {
            //handle response from server here.
            innerHtml += data;
            innerHtml +='&lt;/' + options._tag + '&gt;';
            if(options._insertAfterID !=''){
              $('#'+options._insertAfterID).after(innerHtml);
            }
            else{
              obj.html(innerHtml); 
            }
          });
        } // PHP rule 
        else
        {// .html
          innerHtml += options._content;
          innerHtml +='&lt;/' + options._tag + '&gt;';
          if(options._insertAfterID !=''){
            $('#'+options._insertAfterID).after(innerHtml);
          }
          else{
            obj.html(innerHtml); 
          }
        } // HTML rule 
      }); // End of Returned Function
    };// End of addContent definition
  })(jQuery);
  </code></pre>
  
  <p>hoping for answers, thank you so much!</p>
  
  <p>here's my DOM structure:</p>
  
  <pre>
  &lt;!-- JS  --&gt;
  &lt;script type="text/javascript" src="jquery_plugins/jquery-1.2.6.js" &gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery_plugins/jquery.livequery.js" &gt;&lt;/script&gt;
  &lt;script type='text/javascript' src='jquery_plugins/jquery.simplemodal.js'&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery_plugins/jquery.session.js"&gt;&lt;/script&gt;
  &lt;!--&lt;script type="text/javascript" src="jquery_plugins/jquery-plugin-wrapinner.js"&gt;&lt;/script&gt;--&gt;
  &lt;script type="text/javascript" src="jquery_plugins/jquery.content.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery_plugins/osra_main.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="wrapper"&gt;   
      &lt;div id="header"&gt;
          &lt;div id="headercontent"&gt;Please Enable JavaScript to Continue&lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="main"&gt;
          &lt;div id="sidebarpaper" class="left"&gt;
              &lt;!-- sidebar contents (class="sidebar")--&gt;
          &lt;/div&gt;
          &lt;div id="contentpaper" class="right"&gt;
              &lt;!-- main contents (class="content")--&gt;
          &lt;/div&gt;
          &lt;div id="modals" class="clear"&gt;
              &lt;!--modal pop-up window --&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="footer"&gt;&lt;p&gt;&lt;/p&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </pre>
  
  <p>I am loading the content dynamically in div with id <code>#contentpaper</code>.
  I don't know how to rebind, other that using livequery plugin, with this usage:
  <code>$("#btnID").livequery('click',function(){});</code></p>
  
  <p>-bgreen1989</p>