Multi search bar

Question

This searches within three search engines. I would like if you could tell me any ways to make this better:

function google() {
  var good = document.getElementById("theStuff").value;
  window.location.href = 'http://www.google.com/search?q=' + good;
}
function yahoo() {
  var good = document.getElementById("theStuff").value;
  window.location.href = 'http://search.yahoo.com/search?p=' + good;
}
function bing() {
  var good = document.getElementById("theStuff").value;
  window.location.href = 'http://www.bing.com/search?q=' + good;
}

.myButton {
	-moz-box-shadow:inset 0px 50px 19px 50px #ffffff;
	-webkit-box-shadow:inset 0px 50px 19px 50px #ffffff;
	box-shadow:inset 0px 50px 19px 50px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:3px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:13px 45px;
	text-decoration:none;
	text-shadow:0px -6px 0px #ffffff;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.myButton:active {
	position:relative;
	top:1px;
}
.myButton {
	-moz-box-shadow:inset 0px 50px 19px 50px #ffffff;
	-webkit-box-shadow:inset 0px 50px 19px 50px #ffffff;
	box-shadow:inset 0px 50px 19px 50px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:3px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:13px 45px;
	text-decoration:none;
	text-shadow:0px -6px 0px #ffffff;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.myButton:active {
	position:relative;
	top:1px;
}

<textarea rows="3" cols="50" id="theStuff"></textarea><br>
<a onclick="google()" target="blank" class="myButton">google</a><br>
<a onclick="yahoo()" class="myButton">yahoo</a><br>
<a onclick="bing()" class="myButton">bing</a><br>

Answer 1

Consider exporting the following line into a function:

var good = document.getElementById("theStuff");

This way, if you ever change the way the input is received, you'll only have to change it one place instead of three.

In terms of conventions:

• In HTML we don't use camel case, but instead we use dashes. So, theStuff should really be the-stuff, but that name doesn't really mean anything. Consider naming it search-bar or something.
• In your CSS, add a space before the value. background:black should look like background: black (space between : and black).