style first character of a paragraph using jquery

Question

i\'m looking for a way to style the first character in a paragraph. I\'ve used this function to return the first character

var x= $(\".about p:eq(0)\").text(         


        

Answer 1

With Jquery : http://jsfiddle.net/2wkjyz4g/2/

var x= $(".about p:eq(0)").text();
var text=''+x.charAt(0)+'';
$(".about p:eq(0)").html(text + x.slice(1,x.length));

With css : http://jsfiddle.net/pe5Loaqn/

.about p:first-child:first-letter {
    color:red;
}

because you asked for jquery solution and you selected 1st(:eq(0))

tag.

update after @Garconis' comment

var parent = "p"

function styleFirst(elem){
	var content = $(elem).contents()[0];
  if(content.nodeType == 1){
  	 styleFirst(content);
  }else if(content.nodeType == 3){
     $(elem).html(style(String(content.nodeValue)));
  }
}

function style(txt){
    var newTxt = '' + txt.charAt(0) + '';
		return newTxt + txt.slice(1, txt.length);
}
styleFirst(parent);

.fChar {
    color:red;
}

span{
  color: blue;
}

Winter is here !!!!!!!!!!!

Update in code:

Can retain the nodes in the para tag also can style 1st text character even if it is nested in any other element.

The code can be updated to check if 1st char is space/tab etc in style() method and subsequent styling can be applied.