This is what I am trying to do. First I get time in microseconds. Then I want to create a div (with the id x+microseconds) inside a div called container. And finally I want to add a image to the programmatically created div and fade in the div (and image). I have tried all sorts of things but I can not get my code to work. What am I doing wrong?

This is my code:

var img = document.createElement('img');
filename = "images/"+filename;
img.src = filename;
img.alt = "My alt text";
var now = new Date().getTime() / 1000;
now = "#x"+now;
jQuery("#container").append("<div {id:now} />");
$(now).hide(); 
document.getElementById(now).appendChild(img);
$(now).fadeIn(1000);

    First problem I see is that this:

    <div {id:now} />

    is not valid HTML markup.

    Second, why not just chain all of the jQuery methods together? In other words, this:

    $(foo).method1();
$(foo).method2();
$(foo).method3();

    can be written as:

    $(foo).method1()
      .method2()
      .method3();

    (using new lines because I still like to maintain readability).

      Third, jQuery already provides methods for getting an element by its ID, creating elements, and appending one element to another - it seems to me it would be cleaner to use those instead of dropping down to plain JavaScript.

        Write a Reply...