please help me in this javascript img load code

hello,
iam kind of new at javascript, but iam trying my best to be better and better.
so i have 3 divs (my_block, my_image, my_description) as you see in my code below

<div class = "my_block">
     <div class = "my_image">
          <img src="images/pic.jpg" width="600" height="600">
     </div>

     <div class = "my_description">
          <a> Description goes here.... ! </a>
     </div>
</div>

Code (markup):

just i want to display the "my description" div only after the 100% image loading completion which exist in "my_image" div.

so how can i get this done with Javascript please ??
thanks a lot

 

Something like this should work (untested)

<div class = "my_image">
          <img src="images/pic.jpg" width="600" height="600" onload="document.getElementById('my_description').style.display = 'block';">
     </div>

     <div class = "my_description" id="my_description" style="display:none">
          <a> Description goes here.... ! </a>
     </div>

Code (markup):

 

thanks a lot