title: Bookmarklet implementation
body: <p>I'm rephrasing my entire question which previously sounded absurd with this one which is a bit more rational.
  I'm implementing a bookmarklet (tutorials from this link <a href="http://net.tutsplus.com/tutorials/javascript-ajax/create-bookmarklets-the-right-way/" rel="nofollow">http://net.tutsplus.com/tutorials/javascript-ajax/create-bookmarklets-the-right-way/</a> ) a bit similar to the bitly sidebar Refer the link: <a href="http://bitly.com/pages/sidebar" rel="nofollow">http://bitly.com/pages/sidebar</a> 
  Once the user has added the bookmarklet to the fav/bookmarks bar, when user clicks on the bookmarklet my popup opens up with a variety of fields for the user to add..currently doing this in my local machine with static html markup. I haven't included the css necessary for the pop up currently but will implement it shortly.
  But am facing quite a few challenges:
  Here's my code:
  <em>Bookmarklet</em></p>
  
  <pre><code>&lt;a href='javascript:(function(e,a,g,h,f,c,b,d){if(!(f=e.jQuery)||g&gt;f.fn.jquery||h(f)){c=a.createElement("script");c.type="text/javascript";c.src="http://ajax.googleapis.com/ajax/libs/jquery/"+g+"/jquery.min.js";c.onload=c.onreadystatechange=function(){if(!b&amp;&amp;(!(d=this.readyState)||d=="loaded"||d=="complete")){h((f=e.jQuery).noConflict(1),b=1);f(c).remove()}};a.documentElement.childNodes[0].appendChild(c)}})(window,document,"1.3.2",function($,L){alert("div is not hidden");var content_script = $("&lt;script&gt;&lt;/script&gt;").attr("src","bookmarklet_content.js").attr("type","text/javascript").attr("language","Javascript");$("head").append(content_script);});'&gt;Edit&lt;/a&gt;
  </code></pre>
  
  <p><em>JS file included through bookmarklet</em></p>
  
  <pre><code>var html_content = '';
  var isUserSignedIn = 1;
  if(isUserSignedIn) {
    html_content = 'markup for my popup div';
    $('body').append(html_content);
    if($("#tbarAddtoBrfPopup")) {
      alert('element identified');
    } else {
   alert('failed to identify');
   }
  $("#divname").find(".pagename_parent").find(".pagetitletextfield").val(document.title);
  var success_popup = 'another huge bunch of markup';
  $('body').append(success_popup);
  }
  else {
    html_content = 'another pop up for signing in';
    $(html_content).insertAfter($('body'));
  }
  $("#popup1_submit_button").live('click',function(){
    $("#current_popup").hide();
    $("#Success_p0\opup").show();
  });
  // close buttons in my popup
  $(".close").live('click',function(){
    $(this).parent().parent().hide();
  });
  </code></pre>
  
  <p>I'm already feeling the heat with escaping stuff in the markup to prevent not well-formed error( which took me an hour to find and fix), and some special characters like a 'x' for close which is displayed in a funny ascii art style. Even now i get a syntax error for line var html_content=''; which i'm clueless about.</p>
  
  <p>Kindly let me know if there's a better procedure to fetch html and js from an external file and display without issues.</p>
  
  <p>Also this popup works fine for local pages in my machine... when i use the bookmarklet for any public page it appears that the external js is not loaded at all. Seems I'm missing something here.
  <em>Edit</em> guess its because of calling my js file w.r.t its relative path.</p>
  
  <p>Any sort of help or suggestions(except that I should quit coding) would be great.
  Thanks!!</p>