Hi experts, I have to do a small functionality like they did in this site http://www.docstoc.com/search/.net/?catfilter=1 Here they have changed the DIV with 3 different CSS styles, you can see that by clicking the image on left top corner of that grid. i have to do the same so i tried some thing but it doesnt work out. This is what i tried. Can anybody give me better than this? <head runat="server"> <title></title> <style type="text/css"> .display1 .thumb img { width: 100px; height: 60px; float: left; overflow:hidden; } .display1 .title { font-size: 30px; color: #f30; } .display1 .description { font-size: 20px; color: #333; } .display2 .thumb img { width: 150px; } .display2 .title { font-size:30px; color:#033; vertical-align:top; } .display2 .description { display: none; } .display3 .thumb img { display: none; } .display3 .title { font-size: 30px; color: #03f; } .display3 .description { font-size: 23px; color: #f30; } </style> <script type="text/javascript"> changestyle = function(base_class) { document.getElementById('results_data').setAttribute('class', base_class); } </script> </head> <body> <form id="form1" runat="server"> <a href="javascript:changestyle('display1')" id="display1">show style1</a><br /> <a href="javascript:changestyle('display2')" id="display2">show style2</a><br /> <a href="javascript:changestyle('display3')" id="display3">show style3</a><br /> <div id="results_data" class="display1"> <div class="title"> Koala Bear</div> <div class="thumb"> <a><img src="Images/Koala.jpg" alt="Srini"/></a> </div> <div class="description"> Koala is herbivore native to Australia</div> <br /> <div class="title"> Penguins</div> <div class="thumb"> <a><img src="Images/Penguins.jpg" alt="Srini" /></a> </div> <div class="description"> flightless birds living almost exclusively in the southern hemisphere</div> <br /> <div class="title"> Tulips</div> <div class="thumb"> <a><img src="Images/Tulips.jpg" alt="Srini" /></a> </div> <div class="description"> Tulip is a perennial plant in the genus Tulipa</div> <br /> <div class="title"> Chrysanthemum</div> <div class="thumb"> <a><img src="Images/Chrysanthemum.jpg" alt="Srini" /></a> </div> <div class="description"> All hydrangeas will bloom and grow well in morning sun and afternoon shade</div> </div> </form> </body> Code (markup):