Edit in JSFiddle

JavaScript
HTML
CSS
Result

var counter = 3;
var limit = 8;
var addInput = function(divName){
     if (counter > limit)  {
          alert("You have reached the limit of adding " + counter + " inputs");
     }
     else {
          var newdiv = document.createElement('div');
          newdiv.innerHTML = "line " + counter + ": <input type='text' name='myInputs[]' SIZE=80><BR />";
          document.getElementById(divName).appendChild(newdiv);
          counter++;
     }
};

var topics = new Array('basketball', 'fame', 'football', 'women', 'riches', 'violence', 'nyc','oakland', 'cops', 'federal govt', 'mom', 'dad', 'swag', 'tennis', 'twitter', 'skype', 'champagne', 'itp');

var helpBox = "Take the 2 topics and come up with some fresh rhymes! Rhyme 2-4 lines, not always end rhyme, but make it creative!\n\nExample from Drake's \"Fancy\": Jason had this girl Tammy with a purple Bentley / How she got it I ain't never get to ask / I just knew that she was fine like a ticket on the dash";

var randomTopic1 = function() { return Math.floor(Math.random() * topics.length); };
var randomTopic2 = function() { return Math.floor(Math.random() * topics.length); };

$(function() {
    $("#submitRhymes").button().click(function() {
        alert("submitting info, yo");
        return false;
    });
});

<HTML>

<HEAD>
<TITLE>Step #1: Create Da Rhymes! :: Karaoke Flow</TITLE>
<link type="text/css" href="css/pepper-grinder/jquery-ui-1.8.17.custom.css" rel="stylesheet" />    
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.17.custom.min.js"></script>

<link href='http://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css'>
</HEAD>

<BODY>

<DIV ID=header WIDTH="100%"><DIV ID="karaokeFlow">Karaoke Flow</DIV></DIV>

<CENTER>

<H1>Step #1: Create da Rhymes</H1>

<TABLE ID="tablePrompts"><TR><TD>

<SPAN CLASS="rhymePrompts">TOPIC 1:</SPAN><BR />
<SPAN ID="rhymeTopic" CLASS="rhymeAnswers"><SCRIPT TYPE="text/javascript">document.write(topics[randomTopic1()]);</SCRIPT></SPAN>

</TD><TD VALIGN="top">

<SPAN CLASS="rhymePrompts">TOPIC 2:</SPAN><BR />
<SPAN ID="rhymeTarget" CLASS="rhymeAnswers"><SCRIPT TYPE="text/javascript">document.write(topics[randomTopic2()]);</SCRIPT></SPAN>

</TD></TR></TABLE>

<BR />

<FORM ID="createRhymes" NAME="createRhymes" ACTION="">

line 1: <INPUT TYPE="text" NAME="myInputs[]" ID="rhyme1" SIZE=80 /><BR />
<DIV ID="dynamicInput">
line 2: <INPUT TYPE="text" NAME="myInputs[]" SIZE=80><BR />
</DIV>

<BUTTON onClick="addInput('dynamicInput');return false;" CLASS="help">add another dope line</BUTTON>
<BUTTON onClick="alert(helpBox);return false;" CLASS="help">instructions</BUTTON>

<BR /><BR /><BR />

<BUTTON ID="submitRhymes">post yo' rhymes!</BUTTON>

</FORM>

</BODY>

</HTML>

.rhymePrompts { font-size: 16pt; font-weight: bold; }
    BODY, INPUT, BUTTON, #submitRhymes { font-family: 'Permanent Marker', cursive; }
    BODY { margin: 0px; background: #F96B2D; }
    INPUT[type=text] { font-size: 18pt; border: 1px solid #000000;}
    #tablePrompts { text-align: center; background: #4DE0E2; color: #F96B2D; border-style: dotted; border-width: 3px; border-color: #F96B2D; }
    #tablePrompts TD { padding: 20px; }
    .rhymeAnswers { color: black; }
    #header { background: #28F348; color: #6D249E; text-align: center; border-bottom-width: 3px; border-bottom-style: dotted; border-bottom-color: #F96B2D; }
    #karaokeFlow { font-size: 50pt; align: center; }
    #submitRhymes { background: #91FFA3; color: #6D249E; }
    #submitRhymes:hover { background: #28F348; }
    .help { color: gray;}
    .help:hover { color: black; }