Correct placement of JavaScript on landing pages

[#1]

Design Studio incorporates the Custom HTML code into its own code.

It is important to evaluate the execution order to place the code in the correct position.

The editor assigns unique ID numbers to each element placed on a landing page. That is done sequentially.

Note:
Please ensure that you have access to an experienced JavaScript developer.
Marketo Technical Support is not set up to assist with troubleshooting JavaScript.

div id='lpeCDiv_1612' class='lpeCElement'><span class='lpContentsItem formSpan'

The screen shot shows the code is effectively before the form

Elements to be have their default properties changed must to be placed after forms or the elements they are changing, ideally as a small box in the lower right corner. On the other hand code populating fields from cookies or parameters need to be placed before the form.

The following code snippet pre-populates a field. It needs to be placed before the form, retrieving the value before the field is displayed:

<script language="Javascript" src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript" ></script>
<script>
  // to set cookies.  Uses noConflict just in case
  var $jQ = jQuery.noConflict();
  var pEmail = $jQ.getQueryString({ ID: "Email" });

document.getElementById("Email").setAttribute("value", pEmail);

</script>

The next code resizes a text area. The Custom HTML box needs to be placed after the form:

<script src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
var $jQ = jQuery.noConflict();
$jQ(document).ready(function() {
$jQ('#MyFieldName').parents('li').css('margin-bottom','300px;');
});
</script>

<style type="text/css">
form.lpeRegForm textarea { width: 450px; }
</style>