Capitalize headers with jQuery?

Trying to transform a H2 that is in all-caps into normal capitalized. Css text-transform will not work, the text, itself is all-caps.

edit: So, the alert()s, I dont actually want or need those, I was just hoping to see that the script is working. The goal is to get the text in the h2 to be capitalized.

    // ==UserScript==
// @name     az
// @include  *azlyrics.com*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant    GM_addStyle
// ==/UserScript==

alert('this does happen');//i have to click ok 3 times to get rid of it...
$(document).ready(function() {
  var str = $("h2");
  str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
     return letter.toUpperCase();
  });
  alert(str);//this alert never happens.  
});

Ok, here it is, working, thanks to the chosen answer

$(document).ready(function() {
  //var str = $("h2");
  str = $("h2").text();
  str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
     return letter.toUpperCase();
  });
  $( "h2" ).text( str );
 // alert(str);
});

Answers


You are selecting the h2 element itself instead of its contents. The second alert is not shown because you get a TypeError when trying to call toLowerCase on the jQuery reference:

TypeError: undefined is not a function

Update this line and all should be fine:

var str = $("h2").text();

Need Your Help

Win32 How to bring a modeless dialog box to the top

winapi dialog win32gui

I have a set of modeless dialog boxes open, but I can't for the life of me click on one of them get it to appear in the foreground. It gets focus, but the dialog boxes forever remain in the order o...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.