Skip to content Skip to sidebar Skip to footer

How To Apply Same Function To Different Div's Of The Same Name?

When I click on the watch-later icon, the tick will appear correctly. However, when I apply the same div format to another section, the tick will appear at the first div. This is

Solution 1:

I am trying to understand through the formatting, but it seems that it simply has to do with targeting an ID versus a class. HTML only allows for one instance of an ID per page in order to be valid. As this is the case, whenever you target by ID it will likely effect the first instance found. It would be better to have various ID's based on the parent video.

Something like this:

<divid="video1"class="hovertext"><spanclass="video-txt">01:54</span><spanclass="watch-later"><inputtype="image"onclick="showTick()"src="images/watchlater.jpg" /></span><spanclass="tick"style="display:none;"><inputtype="image"onclick="conceal()"onMouseOut="hideTick()"src="images/tick.jpg" /></span></div>

Your javascript should not be included within each parent div either. You should then target the "tick" class of the ID that you are interacting with.

Post a Comment for "How To Apply Same Function To Different Div's Of The Same Name?"