Q:

Select/Highlight option based on a div content

Below code suppose to match the dropdown list with the div content. If "Pineapple" is found, then select this option. I couldn't seem to find the error.
<head>
<script>
function displayResult(){

  var myObject=document.getElementById("mySelect");
  var myValue = $('#myContent').text();

  for(var i=0; i<myObject.length; i++){                        
      if(myObject.options[i].text == myValue){
          myObject.options[i].selected = true; 
          (also tried - myObject.options[i].selectedIndex = i;)
          break;
      }
  }
}
</script>
</head>

<body>

<div id="myContent">Pineapple</div>

<form>
   Select your favorite fruit:
   <select id="mySelect" size="4">
     <option>Apple</option>
     <option>Orange</option>
     <option>Pineapple</option>
     <option>Banana</option>
   </select>
</form>

<button type="button" onclick="displayResult()">Highlight Pineapple Option</button>

</body>

Note:
I want the option to be highlighted. Missing the closing bracket was a typo, corrected. Tried .selectedIndex=i, didn't seem to do the trick.

A:

You are missing a } at the end of the function.
And you should either include jQuery library or change
var myValue = $('#myContent').text();

to
var myValue = document.getElementById('myContent').innerHTML;

A simpler trick to use, though, is (not a good trick afterall...see @RobG's comment)

function displayResult() {

    var myObject = document.getElementById("mySelect");
    var myValue = document.getElementById('myContent').innerHTML;

    myObject.value = myValue;
}

but for IE the options will need to include the value attribute 
<option value="Pineapple">Pineapple</option>

