Set the text in a span

I have this span

<a title="Prev" data-event="click" 
   data-handler="prev" class="ui-datepicker-prev   ui-corner-all">
     <span class="ui-icon ui-icon-circle-triangle-w">Prev</span>
</a>

I need to set the text of the span to be << instead of its current text Prev.

I tried this below, but it didn't change the text as I'd expected. How can this be done?

 $(".ui-icon .ui-icon-circle-triangle-w").html('<<');

Use .text() instead, and change your selector:

$(".ui-datepicker-prev .ui-icon.ui-icon-circle-triangle-w").text('<<');

-- VIEW DEMO --

This is because you have wrong selector. According to your markup, .ui-icon and .ui-icon-circle-triangle-w" should point to the same <span> element. So you should use:

$(".ui-icon.ui-icon-circle-triangle-w").html("<<");

or

$(".ui-datepicker-prev .ui-icon").html("<<");

or

$(".ui-datepicker-prev span").html("<<");

You need to fix your selector. Although CSS syntax requires multiple classes to be space separated, selector syntax would require them to be directly concatenated, and dot prefixed:

$(".ui-icon.ui-icon-circle-triangle-w").text(...);

or better:

$(".ui-datepicker-prev > span").text(...);

$('.ui-icon-circle-triangle-w').text('<<');