how to : change css class of a button in a parent window with javascript or jquery?

Question

I am trying to change the class of a button in a parent window from a popup. I can change the display but the change in class does not seem to take effect. What is wrong with this code that run in the popup? The change to innerHTML and display works but not the className.

   var messages = window.opener.document.getElementById("messages");
   messages.innerHTML="Now linked to Facebook page at "+  link + ".";

   var firstmessage = window.opener.document.getElementById("firstmessage");
   firstmessage.style.display = 'block';
   firstmessage.style.className += ' notice_msg ';

   var choosefanpagebtn = window.opener.document.getElementById("choosefanpagebtn");
   choosefanpagebtn.style.className = "";
   choosefanpagebtn.style.className = "green_button";

Thank you.

Answer 1

Remove the .style after choosefanpagebtn:

var choosefanpagebtn = window.opener.document.getElementById("choosefanpagebtn");
choosefanpagebtn.className = "green_button";

Should work. Not tested, let me know. Also, this line was unnecessary:

choosefanpagebtn.className = "";

Because you're not doing +=. If somehow you did that, and then

choosefanpagebtn.className += "green_button";

later, I could see that line being useful.

Answer 2

just use document.getElementById().className

var messages = window.opener.document.getElementById("messages");
messages.innerHTML="Now linked to Facebook page at "+  link + ".";
var firstmessage = window.opener.document.getElementById("firstmessage");
firstmessage.style.display = 'block';
firstmessage.className += ' notice_msg ';
var choosefanpagebtn = window.opener.document.getElementById("choosefanpagebtn");
choosefanpagebtn.className = "green_button";

Answer 3

Did you try removing the .style in .style.className ?