div中的Google新闻框

I'm trying to place a google news search within a div on my site. I'm currently using the script google provides, but am a novice at Ajax/JavaScript. I am able to display the most recent stories from google news, but don't know how to have it display within a div let alone manipulate the style with CSS. Below is the code I'm using. Any help would be greatly appreciated!

<script type="text/javascript">

    google.load('search', '1');

    var newsSearch;

    function searchComplete() {

      // Check that we got results
      document.getElementById('averagecontainer').innerHTML = '';
      if (newsSearch.results && newsSearch.results.length > 0) {
        for (var i = 0; i < newsSearch.results.length; i++) {

          // Create HTML elements for search results
          var p = document.createElement('p');
          var a = document.createElement('a');
          a.href = newsSearch.results[i].url;
          a.innerHTML = newsSearch.results[i].title;

          // Append search results to the HTML nodes
          p.appendChild(a);
          document.body.appendChild(p);
        }
      }
    }

    function onLoad() {

      // Create a News Search instance.
      newsSearch = new google.search.NewsSearch();

      // Set searchComplete as the callback function when a search is 
      // complete.  The newsSearch object will have results in it.
      newsSearch.setSearchCompleteCallback(this, searchComplete, null);

      // Specify search quer(ies)
      newsSearch.execute('Barack Obama');

      // Include the required Google branding
      google.search.Search.getBranding('branding');
    }

    // Set a callback to call your code when the page loads
    google.setOnLoadCallback(onLoad);

    </script>

If I understand correctly, this is what you need:

Create the <div> and give it an ID:

<div id="your-div">HERE BE NEWS</div>

Then modify the searchComplete funcion like this:

function searchComplete() {

  var container = document.getElementById('your-div');
  container.innerHTML = '';

  if (newsSearch.results && newsSearch.results.length > 0) {
    for (var i = 0; i < newsSearch.results.length; i++) {

      // Create HTML elements for search results
      var p = document.createElement('p');
      var a = document.createElement('a');
      a.href = newsSearch.results[i].url;
      a.innerHTML = newsSearch.results[i].title;

      // Append search results to the HTML nodes
      p.appendChild(a);
      container.appendChild(p);
    }
  }
}

As for style manipulation, you can match the elements by the given ID in css. For example like this:

#your-div a {
    font-weight: bold;
}

EDIT:

To show you that this is working, I have created a jsfiddle: http://jsfiddle.net/enjkG/

There is not a lot of things you can mess up here. I think you may have a syntactic error and did not check the console for errors.