How can I refresh a Div in javascript instead of the whole page?

Question

The code below works and is good but I am going to place it into a DRUPAL page and I would like it to refresh the "DIV" instead of the whole page. Can someone help? Thanks!

            document.write("<div class='box1'><center><h1>Telling Time Worksheets</h1></center><div class='box_number_holder'>")
var nums = [01,02,03,04,05,06,07,08,09,10,11,12];
var gen_nums = [];

function in_array(array, el) {

   for(var i = 0, j = array.length; i < j; i++) 
       if(array[i] == el) return true;
   return false;

}

function get_rand(array) {
    var rand = array[Math.floor(Math.random()*array.length)];
    if(!in_array(gen_nums, rand)) {
       gen_nums.push(rand); 
       return rand;
    }
    return get_rand(array);
}

for(var i = 0; i < 9; i++) {
    document.write("<div class='box_numbers'><center>What Time is it?" + get_rand(nums) + "</center></div>");
}

Thanks!

Answer 1

Create a function that loops through all of your dynamically created div elements:

function refreshDivs() {
   $('.box_numbers > center').each(function() {
       $(this).html('What Time is it? ' + get_rand(nums));
   });
}