Replace input value .val() with jQuery
<p>So basically here is my jsFiddle - <a href="http://jsfiddle.net/CmNFu/" rel="nofollow">http://jsfiddle.net/CmNFu/</a> .</p>

<p>And code also here -</p>

<p>HTML -</p>

<pre><code>&lt;b style="float: left; margin-right: 10px;"&gt;category 1&lt;/b&gt;&lt;input type="checkbox" value="category1" style="float: left;" class="portfolio-category" /&gt;&lt;br /&gt;
&lt;b style="float: left; margin-right: 10px;"&gt;category 2&lt;/b&gt;&lt;input type="checkbox" value="category2" style="float: left;" class="portfolio-category" /&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;input type="text" name="categories" id="portfolio-categories" /&gt;​
</code></pre>

<p>jQuery -</p>

<pre><code>jQuery(document).ready(function() {
    jQuery(".portfolio-category").click(function() {
        if(jQuery(this).is(":checked")) {
            jQuery("#portfolio-categories").val(jQuery("#portfolio-categories").val()+" "+jQuery(this).val());
        }
        else {
            var portfolioCategories = jQuery("#portfolio-categories").val();    
            alert("before + "+portfolioCategories);
            var currentElement = jQuery(this).val()+" ";
            alert(currentElement);
            portfolioCategories = portfolioCategories.replace(currentElement, "");
            alert(portfolioCategories);
        }
    });
});
</code></pre>

<p>​Well basically what I would like to achieve is, when user checks the checkbox, the value automatically adds inside input field (Done, it's working, whooray!), but the problem is when it unchecks the checkbox, the value should be removed from input box (the problem starts here), it doesn't remove anything. You can see I tried assigning val() function to variables, but also without success. Check my example on jsFiddle to see it live. </p>

<p>Any suggestions? I guess replace() is not working for val(), is it?</p>

<p>So, is there any other suggestions?</p>
