# Adding Class to a image

**URL:** <https://forum.kirupa.com/t/adding-class-to-a-image/302622>\
**Category:** web dev\
**Created:** [January 4, 2010, 2:17pm UTC](https://forum.kirupa.com/t/adding-class-to-a-image/302622 "2010-01-04T14:17:10Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![wispas](https://avatars.discourse-cdn.com/v4/letter/w/9de0a6/32.png) [@wispas](https://forum.kirupa.com/u/wispas)\
**Post date:** [January 4, 2010, 2:17pm UTC](https://forum.kirupa.com/t/adding-class-to-a-image/302622/1 "2010-01-04T14:17:10Z")

</div>

Hi,

I currently have a working javascript calender pop up that opens a pop up box when i click inside the text box. The class is currently on the text field. I have tried adding it to the image but that does not work. ☹

Instead i would like to add the class to the image icon and have the calender to open up when i click on the calender icon image.

Can this be done?

* * *

Here is my code:

\<!DOCTYPE html  
PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”  
“[http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd](http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd)”\>  
\<html xmlns=“[http://www.w3.org/1999/xhtml](http://www.w3.org/1999/xhtml)” xml:lang=“en” lang=“en”\>  
\<head\>  
\<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1” /\>  
\<title\>Javascript Calendar\</title\>  
\<script src=“calendar.js” type=“text/javascript” language=“javascript”\>\</script\>  
\<style type=“text/css” media=“screen,projection”\>  
@import url(calendar.css);  
\</style\>  
\</head\>

```
&lt;body&gt;
&lt;form action="getDateFunction.php" method="post"&gt;
    Date Select 1: &lt;input type="text" name="date1" class="calendarSelectDate" /&gt;
     &lt;img src="images/Calendar-icon.png" alt="" width="16" height="16" border="0" /&gt;
     &lt;div id="calendarDiv"&gt;&lt;/div&gt;
    
    &lt;p&gt;
      &lt;label&gt;
      &lt;input type="submit" name="submit" id="submit" value="Submit" /&gt;
      &lt;/label&gt;
  &lt;/p&gt;
&lt;/form&gt;

```

\</body\>  
\</html\>
