Jquery css style not being applied
<p>I feel like an idiot, but I'm going to ask anyway because I am going crazy.</p>

<p>I have an image element on the page that I need to dynamically change the padding on based on a users selection. The only way to do so it to amend the style tag that is on this image since there could be multiple of the page.</p>

<p>To do so I am grabbing the image and then adding a <code>.css()</code> to it.</p>

<pre><code>var currentImg = $(this.$el.find('.form_control').find('img'));
var imagePadding = props ? JSON.parse(props)['ImagePadding']: '';
</code></pre>

<p>and then  </p>

<pre><code>$(currentImg ).css("padding", imagePadding+'!important');
</code></pre>

<p>Seems simple. But it's not applying the css to the element.</p>

<p>The image is coming back looking like this</p>

<pre><code>[&lt;img class=​"mCS_img_loaded" src=​"img/​kiosk/​placeholder.jpg" style=​"font-family:​ Helvetica;​ border:​ 1px solid rgb(0, 65, 120)​;​ color:​ rgb(255, 255, 255)​;​ font-size:​ 1.25em;​ background-color:​ rgb(0, 93, 171)​;​"&gt;​]
</code></pre>

<p>My first thought was because it is coming back in an array (with the []) and tried to drill down using a <code>[0]</code> however that just threw type errors. So I am at a loss. I do not have any other padding styles coming back on it.</p>