title: jQuery - get value from input and then set them as style
body: <p>I have some fields :</p>
  
  <pre><code>&lt;div class="mystyle"&gt;
     &lt;input name="font-size" value="12px" /&gt;
     &lt;input name="font-family" value="Arial" /&gt;
     &lt;input name="color" Value="#333" /&gt;
  
     &lt;button class="setStyle"&gt;Save&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Please note I am not using a <code>form</code>.</p>
  
  <p>Now When I click on button <code>.setStyle</code> then use <code>input</code> name as style attribute and value as attribute value, like:</p>
  
  <pre><code>font-size:12px;
  font-family:Arial;
  color:#333;
  </code></pre>
  
  <p>now assign this style to a div using <code>.css()</code></p>
  
  <p>Please tell me how do I do this properly with jQuery</p>
  
  <p><strong>I have tried this:</strong></p>
  
  <pre><code>jQuery('.setStyle').click(function(){
      var parent = jQuery(this).parent('.mystyle');
  
     // now run each inside parent for geting name and value
     // run a loop for setting CSS, if value is empty dont add style
  }
  </code></pre>