We Keep Coding

I am using TypeForm and need to autofill hidden fields from a .js script

I am using TypeForm and need to autofill utm fields from javascript, everything works except I cant get the html created from the script to show on the page. I am embedding the below code in a html/js module in a clickfunnels page. Any help is very much appreciated.
<div id="typeform"></div>
<script>
//<div id="typeform"></div> <div id="row--27712"></div>
window.onload = function(){
var source = "utm_source=1";
var medium = "utm_medium=2";
var campaign = "utm_campaign=3";
var content = "utm_content=4";
var keyword = "utm_term=5"
var HTMLA = '<div data-tf-widget="mYH43Dz4" data-tf-iframe-props="title=TFS - ANALYTICSDEV V1.1" data-tf-medium="snippet" data-tf-hidden=';
var HTMLquote = '"';
var HTMLcomma = ',';
var HTMLB = '" style="width:100%;height:600px;"></div><script src="//embed.typeform.com/next/embed.js">';
var HTMLC = '</'
var HTMLD = 'script>'
var form = HTMLA.concat(HTMLquote).concat(source).concat(HTMLcomma).concat(medium).concat(HTMLcomma).concat(campaign).concat(HTMLcomma).concat(content).concat(HTMLcomma).concat(keyword).concat(HTMLB);
var form2 = form.replaceAll("undefined","");
document.getEIementById('typeform').innerHTML = form2;
};
</script>

You can pass custom values to hidden fields like this:
<div id="typeform"></div>
<link rel="stylesheet" href="//embed.typeform.com/next/css/widget.css" />
<script src="//embed.typeform.com/next/embed.js"></script>
<script>
var source = '1';
var medium = '2';
var campaign = '3';
var content = '4';
var keyword = '5';
window.tf.createWidget('mYH43Dz4', {
container: document.getElementById('typeform'),
hidden: {
utm_source: source,
utm_medium: medium,
utm_campaign: campaign,
utm_content: content,
utm_term: keyword
}
});
</script>
In case you already have those values in your host page URL, you could use transitive search params feature:
<div
data-tf-widget="mYH43Dz4"
data-tf-transitive-search-params="utm_source,utm_medium,utm_campaign,utm_content,utm_term"
></div>
<script src="//embed.typeform.com/next/embed.js"></script>
Your code does not work because you are adding script tag via innerHTML. This script tag will not execute for security purposes:
https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML#security_considerations
https://www.w3.org/TR/2008/WD-html5-20080610/dom.html#innerhtml0

How to write an array object/element to a table in Javascript

My title for this question may not be using the correct terminology but here is what I would like to do. (I am still new to Javascript so im looking for a basic method)
First my table has to be created using Javascript,
then I need to take an array object/element and "write" it to a table cell.
I say "write" because I'm not sure if that's the correct word to use.
Here is an example of the code I'm working with:
<script type="text/javascript">
/* <![CDATA[ */
var day = [];
day[0] = "monday"
document.write("<table>")
document.write("<tr><td>"**what syntax do i use to insert the data for "day[0]" here**"</td></tr>")
document.write("</table>")
/* ]]> */
</script>

try
<script type="text/javascript">
/* <![CDATA[ */
var day = [];
day[0] = "monday";
document.write("<table>")
document.write("<tr><td>" + day[0] + "</td></tr>")
document.write("</table>")
/* ]]> */
</script>
also you don't have to declare the array like
var day = [];
day[0] = "monday";
you can simply do
var day = ["monday"];

How to make goal completion work on hashchange?

I have an AngularJS webapp where there are no separate pages.
I have set up a goal completion so that there's a code that is triggered by a javascript event,
and it has the following structure:
function call_completion(){
window.google_conversion_id = 973404965;
window.google_conversion_language = "en";
window.google_conversion_format = "1";
window.google_conversion_color = "ffffff";
window.google_conversion_label = "doGHCLPK2wkQpfaT0AM";
window.google_conversion_value = 1.000000;
window.google_remarketing_only = false;
var s = document.createElement('script');
s.type = "text/javascript";
s.src = '//www.googleadservices.com/pagead/conversion.js';
document.body.appendChild(s);
}
Yet, I can't see any completions registered in Google Analytics. What could be the problem?
Is this the correct way to do it? Is there perhaps some nifty plugin that gets this problem right?
UPDATE:
For the new Universal Analytics, there is a plugin called angular-ga.
It eliminates the whole question.

You shouldn't append the script to your view, since it won't be executed.
You should use this:
$.getScript( "http://www.googleadservices.com/pagead/conversion.js" );
To get the script working on that page and execute it.
Hope this helps :)

The <noscript> part also has to be included.
Something like this:
$('body')
.append('\
<!-- Google Code for Subscriptions Conversion Page -->\n\
<script type="text/javascript">\n\
/* <![CDATA[ */\n\
var google_conversion_id = 973404965;\n\
var google_conversion_language = "en";\n\
var google_conversion_format = "1";\n\
var google_conversion_color = "ffffff";\n\
var google_conversion_label = "doGHCLPK2wkQpfaT0AM";\n\
var google_conversion_value = 1.000000;\n\
var google_remarketing_only = false;\n\
/* ]]> */\n\
</script>\
');
$('body')
.append('<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">')
.append($('<noscript>')
.append($('<div style="display:inline;">')
.append('<img height="1" width="1" style="border-style:none;" alt="" src="//www.googleadservices.com/pagead/conversion/973404965/?value=1.000000&label=doGHCLPK2wkQpfaT0AM&guid=ON&script=0"/>')
)
);

How to print javascript within HTML id tag

So I built randomizing script that prints random numbers from 1 through twenty. And those are all css classes that are in my css file. So here is what I want to do.
I want to have javascript print out the random number in this header id="" and
<!-- This is my js file -->
<script type="text/javascript" src="/assets/quotes.js"></script>
<!-- This is what I want -->
<header id="<script>showClass();</script>">
This is my js code:
var Classes=new Array()
Classes[0] = "one";
Classes[1] = "two";
Classes[2] = "three";
Classes[3] = "four";
Classes[4] = "five";
Classes[5] = "six";
Classes[6] = "seven";
Classes[7] = "eight";
Classes[8] = "nine";
Classes[9] = "ten";
Classes[10] = "eleven";
Classes[11] = "twelve";
Classes[12] = "thirteen";
Classes[13] = "fourteen";
Classes[14] = "fifteen";
Classes[15] = "sixteen";
Classes[16] = "seventeen";
Classes[17] = "eighteen";
Classes[18] = "nineteen";
Classes[19] = "twenty";
Classes[20] = "green";
var Q = Classes.length;
var whichClass=Math.round(Math.random()*(Q-1));
function showClass(){document.write(Classes[whichClass]);}
var random =document.getElementById('random').innerHTML="showClass()";
How can I make it so that the javascript renders in the id=""

The JS won't render in the quotes as that is just a string. Instead do something like:
<script type="text/javascript">
document.write("<header id=\"");
showClass();
document.write("\">");
</script>
Personally, I'd prefer to add the element in an onLoad handler as roXon suggests but I think the above should drop in to what you have.
Edited to match question revisions.

getting specific line from ajax

I have this code:
<html>
<head>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script>
var TheSource;
$.ajax({
url: "http://www.domain.com/",
cache: false,
success: function(html){
TheSource = html;
TheSource = TheSource.substring(1,TheSource.indexOf("</head>"));
TheTitle = TheSource.substring(TheSource.indexOf("<title>")+7,TheSource.indexOf("</title>"));
alert(TheSource);
}
});
</script>
</head>
<body>
</body>
</html>
i get the part of the source i need from my site and i want to get from TheSource only the lines that start with var (i have several of them)
my questions are:
how do i break this returned html to lines?
how do i get everyline and check the beginning of it?
how do i remove indent of the script? (cause i have several lines with the var that begin with indent

Here's one way of doing it:
var TheSource = "var abcd; abcd; abcdabcd; var abcde ; var abcdef; \tvar abcd;\tvar;var;no var; \t no var;\nanother line;\nvar new line;";
var lines = TheSource.split(/;/); // get each line
var foundLines = new Array();
for (index in lines) {
var line = lines[index];
if (line.search(/^\s*var/)!=-1) { // look for "var" at the beginning of the string (ignoring whitespaces)
foundLines.push(line + ";"); //add a semicolon back
}
}
document.write(foundLines.join("<br>"));