How To Set Value Of Dropdown Lists In Gridview With Javascript

I have a dropdownlist and a gridview with a drop down list in every row. I have removed other cols in Grid for simplicity.

Whenever a new value in the dropdownlist is selected I would like to set all of the dropdownlists in the gridview to that same value via javascript. (Yea both the dropdownlist outside the gird and the ones inside the grid are populated by the same data source)

The dropdownlist:

<asp:DropDownList onchange="javascript:onJDSelection();" ID="DropDownList3" runat="server"
DataSourceID="SqlDataSource4" DataTextField="circt_cstdn_nm"
DataValueField="circt_cstdn_user_id">
</asp:DropDownList>

The GridView:

<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False"
DataSourceID="SqlDataSource1" onrowdatabound="GridView2_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="Change to Job Designer" SortExpression="circt_Cstdn_nm">
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("circt_Cstdn_nm") %>'></asp:TextBox>
</EditItemTemplate>
<ItemTemplate>
<asp:DropDownList ID="ddl_jd" runat="server" DataSourceID="SqlDataSource4" DataTextField="CIRCT_CSTDN_NM"
DataValueField="CIRCT_CSTDN_user_id"></asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

My current attempt:

function onJDSelection() {
var jd = document.getElementById('ctl00_MAIN_DropDownList3').Text;
var grid = document.getElementById('ctl00_MAIN_GridView2');
for (var i = 1; i < grid.rows.length; i++) {
grid.rows[i].cells[0].getElementsByTagName("*")[1].selectedText = jd;
}
}

[Code]...

When clicking on the dropdown I get an alert that says "test" and an alert that says "[Object object]" However nothing happens with the dropdowns in the grid and the alert(i) never fires.