jquery - jScrollPane jEditable DOM problems -

i having funky problem.

here's code. run getjson() fetch info php pulls db , fill div result. have jscrollpane , jeditable user can scroll down , click edit of content. works , doesn't work makes me wonder if browser not interpreting code or if misunderstanding fundamental dom concepts here....

$().ready(function() {     $('#pane1').jscrollpane();     $('#tab_journal').tabs();      $('#tab2').load("/journal_new.php");      var i=0;     var row = '';     var k, v, dt;      $.getjson("/ajax.php?j=22", function(data) {         row = '<p>';         while(i<data.length) {             $.each(data[i], function(k, v) {                 if (k == 'subject') {                     row += '<div style="font-size:1.5em; color:#000000;"><div class="editable" style="width:705px;" id="title-'+data[i].id+'">'+v+'</div></div>posted: '+dt+'<br />';                 } else if (k == 'dt') {                     dt = v;                 } else if (k == 'msg') {                     row += '<div class="editablemsg" style="width:705px; height:40px;" id="msg-'+data[i].id+'">'+v+'</div></p>';                 }             });             i++;         }         $('#pane1').append(row).jscrollpane({scrollbarwidth:10, scrollbarmargin:10, showarrows:true});     });      $('.editable').livequery(function () {         $('.editable').editable("/savejournal.php", {             submitdata : function() {             },             tooltip   : 'click edit',             indicator : '<img src="/ui/images/indicator.gif">',             cancel    : 'cancel',             submit    : 'ok'         });         $('.editablemsg').editable("/savejournal.php", {             submitdata : function() {             },             tooltip: 'click edit',             indicator : '<img src="/ui/images/indicator.gif">',             cancel    : 'cancel',             submit    : 'ok',             type      : 'textarea'         });         $(".editable,.editablemsg").mouseover(function() { $(this).css('background-color', '#fdd017'); });         $(".editable,.editablemsg").mouseout(function() { $(this).css('background-color', '#fff'); });     }); }); 

and html:

<div id="tab_container" style="margin:0px 0px 2px 8px;">     <ul id="tab_journal">         <li><a href="#tab1"><span>view / edit</span></a></li>         <li><a href="#tab2"><span>new entry</span></a></li>     </ul> </div> <div id="tab1" style="margin:0px 0px 0px 8px;">     <div id="pane1" class="scroll-pane super-wide"></div> </div> <div id="tab2" style="margin:0px 0px 0px 8px; width:700px;"></div> 

thanks world.

have been unable break. seems line of code:

$('#tab2').load("/journal_new.php"); 

was not making browser happy.