Getting jQuery to apply styles after page load

I’m using a function to display a table of data on a page (from an array that’ll be linked), and using jquery to alternate the background-color of the rows.
Readers will then have the option to search the data (not important here) and then to reload the original data. But when the original showAll() function is called from a click event, jQuery doesn’t apply the background colors at all.

Any suggestions as to how to ‘re-awaken’ jQuery the second time the showAll() function gets called.

Thanks - code below:


	<script src="" type="text/javascript"></script>
	<script type="text/javascript">
	<script type="text/javascript">
	function showAll() {
	var newcode = "";
		for (i=1; i<7; i++) {
		newcode = newcode + "<div class='datarow'>Data Here<\\/div>";
	document.getElementById('datas').innerHTML = newcode;

<body bgcolor="ffffff">

	<form><input type="button" value="Show All" onClick="showAll()"></input></form>
	<div id="datas" style="width: 300px; height: 400px; "></div>
	<script language="javascript" type="text/javascript">showAll();</script>


I think the problem is that there is nothing about background colors in your showAll function. Background setting code was called once document was ready, but it will not apply to newly added rows, if you don’t call it specifically again.
I would move code below to your showAll function and see if it works (since your are calling showAll at load time anyway, I think you don’t need to have it in ready function then).


Have a look here

It works! Thanks so much igv, and thanks for the link blain!