plugins and ajax populated div tags

plugins and ajax populated div tags

Hello All..

I am relatively new to jquery and javascript and I am amazed all the possibilities that it presents.

I've run into a issue that I can't find a solution to even after several days of googleing and researching here on the forums.  Perhaps I just don't know the keywords that relate to the solution. 

When I attempt to combine a plug-in or jquery itself for that matter and a div tag that is being populated by an ajax call the div is being populated but the plug-in is not working on it. 

Here is an example:

  1. <head>
  2.     <script type="text/javascript" src="/~donavon/js/jquery.js"></script>
  3.     <link href="/~donavon/js/jcarousel/style.css" rel="stylesheet" type="text/css" />
  4.     <script type="text/javascript" src="/~donavon/js/jcarousel/lib/jquery-1.2.3.pack.js"></script>
  5.     <script type="text/javascript" src="/~donavon/js/jcarousel/lib/jquery.jcarousel.pack.js"></script>
  6.     <link rel="stylesheet" type="text/css" href="/~donavon/js/jcarousel/lib/jquery.jcarousel.css" />
  7.     <link rel="stylesheet" type="text/css" href="/~donavon/js/jcarousel/skins/tango/skin.css" />
  8.     <script type="text/javascript">
  9.         jQuery(document).ready(function() {
  10.             jQuery('#mycarousel').jcarousel({
  11.                 vertical: true,
  12.                 scroll: 2
  13.             });
  14.         });
  15.     </script>
  16. </head>
  17. <body>
  18.     <div id="ajaxPopulate" style="padding:1em;border:none;"></div>

  20.     <script type="text/javascript" src="update_feed.js"></script>
  21.     <script type="text/javascript">
  22.         // Set ajax update interval
  23.         var minutesBetweenUpdates = 1;
  24.         var feedUrl = 'http://rss.cnn.com/rss/cnn_topstories.rss';
  25.         var scriptUrl = 'update_feed1.php';
  26.         var cacheDuration = 3600;  // seconds, normally 3600 (1 hour)
  27.         var divId = 'ajaxPopulate';
  28.         var feed1 = new updateFeed(minutesBetweenUpdates,feedUrl,scriptUrl,cacheDuration,divId);
  29. </script>
  30. </body>

+-----------------------------------------------------------------------------------+
The ajax div look like this after it's populated:

  1. <div id="ajaxPopulate" style="padding:1em;border:none;">
  2.     <ul id="mycarousel" class="jcarousel jcarousel-skin-tango">
  3.         <li>
  4.             <a href="...">txt</a><br>
  5.             ... more text ...
  6.         </li>
  7.         <li>
  8.             <a href="...">txt</a><br>
  9.             ... more text ...
  10.         </li>
  11.         <li>
  12.             <a href="...">txt</a><br>
  13.             ... more text ...
  14.         </li>
  15.     </ul>
  16. </div>