title: Losing jQuery functionality after postback
body: <p>I have seen a TON of people reporting this issue online, but no actual solutions. I'm not using AJAX or updatepanels, just a dropdown that posts back on selected index change. My HTML is</p>
  
  <pre><code>&lt;div id="myList"&gt;
                  &lt;table id="ctl00_PlaceHolderMain_dlFields" cellspacing="0" border="0" style="border-collapse:collapse;"&gt;
      &lt;tr&gt;
          &lt;td&gt;
                          &lt;tr&gt;
                              &lt;td class="ms-formlabel" style="width: 175px; padding-left: 10px"&gt;
                                  &lt;span id="ctl00_PlaceHolderMain_dlFields_ctl00_lblDestinationField"&gt;Body&lt;/span&gt;
  
                              &lt;/td&gt;
                              &lt;td class="ms-formbody" style="width: 485px"&gt;
                                  &lt;input name="ctl00$PlaceHolderMain$dlFields$ctl00$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl00_txtSource" class="ms-input" style="width:230px" /&gt;
                                  &lt;select name="ctl00$PlaceHolderMain$dlFields$ctl00$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl00_ddlSourceFields" class="ms-input"&gt;
              &lt;option value="Some Field Name 1"&gt;Some Field Name 1&lt;/option&gt;
              &lt;option value="Some Field Name 2"&gt;Some Field Name 2&lt;/option&gt;
              &lt;option value="Some Field Name 3"&gt;Some Field Name 3&lt;/option&gt;
              &lt;option value="Some Field Name 4"&gt;Some Field Name 4&lt;/option&gt;
  
          &lt;/select&gt;
                                  &lt;a href="#" id="appendSelect"&gt;append&lt;/a&gt;
                              &lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/td&gt;
      &lt;/tr&gt;&lt;tr&gt;
          &lt;td&gt;
                          &lt;tr&gt;
                              &lt;td class="ms-formlabel" style="width: 175px; padding-left: 10px"&gt;
                                  &lt;span id="ctl00_PlaceHolderMain_dlFields_ctl01_lblDestinationField"&gt;Expires&lt;/span&gt;
  
                              &lt;/td&gt;
                              &lt;td class="ms-formbody" style="width: 485px"&gt;
                                  &lt;input name="ctl00$PlaceHolderMain$dlFields$ctl01$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl01_txtSource" class="ms-input" style="width:230px" /&gt;
                                  &lt;select name="ctl00$PlaceHolderMain$dlFields$ctl01$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl01_ddlSourceFields" class="ms-input"&gt;
              &lt;option value="Some Field Name 1"&gt;Some Field Name 1&lt;/option&gt;
              &lt;option value="Some Field Name 2"&gt;Some Field Name 2&lt;/option&gt;
              &lt;option value="Some Field Name 3"&gt;Some Field Name 3&lt;/option&gt;
              &lt;option value="Some Field Name 4"&gt;Some Field Name 4&lt;/option&gt;
  
          &lt;/select&gt;
                                  &lt;a href="#" id="appendSelect"&gt;append&lt;/a&gt;
                              &lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/td&gt;
      &lt;/tr&gt;&lt;tr&gt;
          &lt;td&gt;
                          &lt;tr&gt;
                              &lt;td class="ms-formlabel" style="width: 175px; padding-left: 10px"&gt;
                                  &lt;span id="ctl00_PlaceHolderMain_dlFields_ctl02_lblDestinationField"&gt;Title&lt;/span&gt;
  
                              &lt;/td&gt;
                              &lt;td class="ms-formbody" style="width: 485px"&gt;
                                  &lt;input name="ctl00$PlaceHolderMain$dlFields$ctl02$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl02_txtSource" class="ms-input" style="width:230px" /&gt;
                                  &lt;select name="ctl00$PlaceHolderMain$dlFields$ctl02$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl02_ddlSourceFields" class="ms-input"&gt;
              &lt;option value="Some Field Name 1"&gt;Some Field Name 1&lt;/option&gt;
              &lt;option value="Some Field Name 2"&gt;Some Field Name 2&lt;/option&gt;
              &lt;option value="Some Field Name 3"&gt;Some Field Name 3&lt;/option&gt;
              &lt;option value="Some Field Name 4"&gt;Some Field Name 4&lt;/option&gt;
  
          &lt;/select&gt;
                                  &lt;a href="#" id="appendSelect"&gt;append&lt;/a&gt;
                              &lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The above Div tag is static, and the table is generated from a DataList object. On postback the datalist reloads using a new dataset, for example</p>
  
  <pre><code>&lt;div id="myList"&gt;
                  &lt;table id="ctl00_PlaceHolderMain_dlFields" cellspacing="0" border="0" style="border-collapse:collapse;"&gt;
      &lt;tr&gt;
          &lt;td&gt;
                          &lt;tr&gt;
                              &lt;td class="ms-formlabel" style="width: 175px; padding-left: 10px"&gt;
                                  &lt;span id="ctl00_PlaceHolderMain_dlFields_ctl00_lblDestinationField"&gt;Notes&lt;/span&gt;
  
                              &lt;/td&gt;
                              &lt;td class="ms-formbody" style="width: 485px"&gt;
                                  &lt;input name="ctl00$PlaceHolderMain$dlFields$ctl00$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl00_txtSource" class="ms-input" style="width:230px" /&gt;
                                  &lt;select name="ctl00$PlaceHolderMain$dlFields$ctl00$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl00_ddlSourceFields" class="ms-input"&gt;
              &lt;option value="Some Field Name 1"&gt;Some Field Name 1&lt;/option&gt;
              &lt;option value="Some Field Name 2"&gt;Some Field Name 2&lt;/option&gt;
              &lt;option value="Some Field Name 3"&gt;Some Field Name 3&lt;/option&gt;
              &lt;option value="Some Field Name 4"&gt;Some Field Name 4&lt;/option&gt;
  
          &lt;/select&gt;
                                  &lt;a href="#" id="appendSelect"&gt;append&lt;/a&gt;
                              &lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/td&gt;
      &lt;/tr&gt;&lt;tr&gt;
          &lt;td&gt;
                          &lt;tr&gt;
                              &lt;td class="ms-formlabel" style="width: 175px; padding-left: 10px"&gt;
                                  &lt;span id="ctl00_PlaceHolderMain_dlFields_ctl01_lblDestinationField"&gt;URL&lt;/span&gt;
  
                              &lt;/td&gt;
                              &lt;td class="ms-formbody" style="width: 485px"&gt;
                                  &lt;input name="ctl00$PlaceHolderMain$dlFields$ctl01$txtSource" type="text" id="ctl00_PlaceHolderMain_dlFields_ctl01_txtSource" class="ms-input" style="width:230px" /&gt;
                                  &lt;select name="ctl00$PlaceHolderMain$dlFields$ctl01$ddlSourceFields" id="ctl00_PlaceHolderMain_dlFields_ctl01_ddlSourceFields" class="ms-input"&gt;
              &lt;option value="Some Field Name 1"&gt;Some Field Name 1&lt;/option&gt;
              &lt;option value="Some Field Name 2"&gt;Some Field Name 2&lt;/option&gt;
              &lt;option value="Some Field Name 3"&gt;Some Field Name 3&lt;/option&gt;
              &lt;option value="Some Field Name 4"&gt;Some Field Name 4&lt;/option&gt;
  
          &lt;/select&gt;
                                  &lt;a href="#" id="appendSelect"&gt;append&lt;/a&gt;
                              &lt;/td&gt;
                          &lt;/tr&gt;
                      &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;&lt;/div&gt;
  </code></pre>
  
  <p>After the postback and the datalist is reloaded, my JQuery doesn't work anymore. No errors, nothing. I don't see any actual changes in the objects in the HTML that should cause this. How do I fix this? Any workarounds or bandaides I can apply? My JQuery is below</p>
  
  <pre><code>&lt;script type='text/javascript'&gt;
      $(document).ready(function () {
          $('#myList a').live("click", function () {
              var $selectValue = $(this).siblings('select').val();
              var $thatInput = $(this).siblings('input');
              var val = $thatInput.val() + ' |[' + $selectValue + ']|';
              $thatInput.val(jQuery.trim(val));
          })
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Thanks!!</p>