スタイリングをJavascript変数に割り当てるにはどうすればよいですか？

Question

私はシンプルでダイナミックなメールフォームフィールドを持っています。ユーザーが電子メールを送信すると、「Got it！」というメッセージが表示されます。私は文字列が必要です "それを得ました！"私のCSSの私の<p>タグと同じスタイリングを持っている..しかし、私はjavascriptでプロパティを割り当てる方法を知らないし、コードの他の部分はルビーであり、私はそれも知らない。それはおそらく簡単な修正ですが、私は答えを見つけることができません！ここで

はjavascriptのです：

var finalText = 
     'Got it!'; 


// Create a new div that will contain our thank you stuff 
var thankyouDiv = document.createElement("div"); 
thankyouDiv.id = "home_thankyou"; 
thankyouDiv.innerHTML = finalText; 

// Store reference to the formm 
var form = document.getElementsByTagName("form")[0]; 

// Add the new thankyoudiv before the form 
form.parentNode.insertBefore(thankyouDiv, form ); 

// remove the form tag alltogether 
form.parentNode.removeChild(form); 

そしてここでは、HTML/Rubyコードです：

<%= form_for :home, :remote=>true, :update=>"emailsubmit", :url => {:controller=>"home", :action=>"create"} do |f| %> 
<div id=emailsubmit><%= email_field("infosignup", "email", :placeholder=>"Enter your email") %></div> 
<%= submit_tag("", :id=>"arrow2") %> 

任意のヘルプ？

Answer 1

スタイルを設定する必要があるJavaScriptではなく、書き込む<div>です。

があなたの新しいdiv要素にクラスを割り当てます。

// Create a new div that will contain our thank you stuff 
var thankyouDiv = document.createElement("div"); 
thankyouDiv.className = "someClass"; 
thankyouDiv.id = "home_thankyou"; 
thankyouDiv.innerHTML = finalText; 

次に、あなたのCSSには、あなたが<p>を定義した同じルールでクラスを定義します。

p, .someClass { 
    color: red; 
}