javascript - JQuery - creating a function that hides/displays content -

If you go here:

You can see a demonstration of my jQuery function.

Actually, it seems that div is over the mouse

However, at this time you will realize that when the mouse is placed above all Div element, all text are overlapping each other.

I need to remove a way to hide the contents of the previous divas when the mouse is on the other div. Not sure how to do it.

Here is a snippet of jQuery code:

  $ (document) .ready (function () {var current_id; $ ('(id'). '_') [1]; $ ('div # text_' + current_id). Stop () .animate ({'opacity': '1'}, 'slow');});});   
 Thanks.  
 
 
 
 Something like this might be an example of this script:  
  $ (document) .ready (function () {var current_id, previous_id; $ ('div.video_image'). Hover (function () (previous_id = current_id; if (previous_id) $ ('div # text_' + Previous_id) .stop () ({'opacity': '0'}, 'slow'); current_id = $ (this) .attr ('id'). Partition ('_') [1]; $ (' (# 'Opacity': '1'}, 'slow');};});