Add css using Onchange
<p>How change code CSS` in JavaScript?</p>

<p><strong>HTML :</strong></p>

<pre><code>&lt;input type="text" name="text_field"  value="text" id ="hd" /&gt;

&lt;div id="color"&gt;
    &lt;input type="text" name="color" class ="border-bottom" value=""/&gt;
&lt;/div&gt;
</code></pre>

<p><strong>Javascript :</strong></p>

<pre><code>$(document).ready(function() {
     $('#color input').change(function(){
          var css = $(this).attr("class");
          var z   = string(css);  // change type to string
          var x   = z+': 1px solid'; // mix 
          $("#hd").css(css,$(this).val());
     });
});
</code></pre>

<p>I need write <code>1px solid</code> in field, I try mix from <code>border-bottom</code> and <code>1px solid</code> to new variable (<code>border-bottom : 1px solid</code>), then I just input color type like red/blue/dll.</p>

<p>Please see here for more understanding <a href="https://jsfiddle.net/1Lmhj3xp/1/" rel="nofollow">https://jsfiddle.net/1Lmhj3xp/1/</a></p>