jQuery: Apply css to image on click event - css

Question

I want basically the same as
jquery select image
a row of images that you can select one of.
But I'm trying to style the one I select, and store it.
var selectedicon = "";
function selecticon(){
$('#iconselect').children().click(function(){
$(".selectedicon").removeclass("selectedicon");
selectedicon = $(this).attr("src");
$(this).addclass("selectedicon");
});
}
on this
<div id="iconselect">
<img src="/red-dot.png" class="selectedicon" />
<img src="/green-dot.png" />
<img src="/blue-dot.png" />
<img src="/orange-dot.png" />
</div>
What am I doing wrong?

Answer 1

jQuery addClass and removeClass are mistyped (C should be capital).
Is the function selecticon called at all?

Answer 2

As you are not saying what does not work, here is a wild guess:
Probably the function selection() is never called and thus the click handler is never attached to the elements. Put your code into the document.ready callback instead:
var selectedicon = "";
$(function() {
// I would use $('#iconselect img').click(...)
$('#iconselect').children().click(function(){
$(".selectedicon").removeClass("selectedicon");
selectedicon = $(this).attr("src");
$(this).addClass("selectedicon");
});
});
This ensures that your code is executed once the DOM is loaded.
You also have some typos in the method names:
removeclass() must be removeClass()
addclass() must be addClass()