# Javascript onclick for thumbnails

**URL:** <https://www.ruby-forum.com/t/javascript-onclick-for-thumbnails/141785>\
**Category:** Rails\
**Created:** [June 30, 2008, 4:21pm UTC](https://www.ruby-forum.com/t/javascript-onclick-for-thumbnails/141785 "2008-06-30T16:21:55Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![srinathbtech](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/7bcc69/32.png) [@srinathbtech](https://www.ruby-forum.com/u/srinathbtech)\
**Post date:** [June 30, 2008, 4:21pm UTC](https://www.ruby-forum.com/t/javascript-onclick-for-thumbnails/141785/1 "2008-06-30T16:21:55Z")

</div>

Hi,

i was struggling for a function where only 1 thumbnail should be active  
and others inactive when clicked on the particular thumbnail.  
code:

1. view:
2. 
3. 
4. 

5. 

```
        <% for eligible_exercise in excercises %>

```

6. 

```
   <% exercise = eligible_exercise.exercise %>

```

7. 

```
  <div onclick="PlayVideo_options('<%= exercise.path_to_video

```

%\>’, ‘active\_\<%= exercise.id %\>’)" class=“video\_option” id=“active\_\<%=  
exercise.id %\>”\>  
12.

 ![]()
  
13.   
14. \<% end %\>  
15. 

what i want is, when user clicks on 1st thumbnail the class should  
become ‘video\_option active\_video’.And when clicks on 2nd thumbnail, the  
2nd thumbnail should become ‘video\_option active\_video’ and the 1st  
thumbnail should become ‘video\_option’

Means there should be only 1 thumbnail in class=“video\_option  
active\_video” state when clicked and others in class=“video\_option”  
and i was getting all active when clicked using above function

thanks in advance !!

---

<div class="post-metadata">

**Author:** ![srinathbtech](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/s/7bcc69/32.png) [@srinathbtech](https://www.ruby-forum.com/u/srinathbtech)\
**Post date:** [June 30, 2008, 4:25pm UTC](https://www.ruby-forum.com/t/javascript-onclick-for-thumbnails/141785/2 "2008-06-30T16:25:06Z")

</div>

On 30 Jun 2008, at 15:21, Srinath A. wrote:

> and i was getting all active when clicked using above function

Read up on prototype’s $$, addClassName and removeClassName functions  
(on [prototypejs.org](http://prototypejs.org))

Fred