When you click a certain tag, an option will be selected.

For example: you click on a Div tag with id="object3", this action will automatically select the Option tag "Water".

Anyone know a Javascript that can do this (without using the value attribute)?


HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Click tag will select option</title>
</head>

<body>


<form action="">

  <fieldset>
  
    <ul style="list-style:none;">
      <li>
        <select id="select_items" name="SelectItems">
          <option id="item-fire" value="xjakgd">Fire</option>
          <option id="item-earth" value="yuygas">Earth</option>
          <option id="item-water" value="piowqe">Water</option>
          <option id="item-wind" value="mnbvzi">Wind</option>
        </select>
      </li>
    </ul>
          
  </fieldset>

</form>

<div id="click-object-1" style="background-color:#F00;width:30px;height:30px;margin:4px;cursor:pointer;"></div>
<div id="click-object-2" style="background-color:#0F0;width:30px;height:30px;margin:4px;cursor:pointer;"></div>
<div id="click-object-3" style="background-color:#00F;width:30px;height:30px;margin:4px;cursor:pointer;"></div>
<div id="click-object-4" style="background-color:#FF0;width:30px;height:30px;margin:4px;cursor:pointer;"></div>


</body>
</html>