jQueryはクリック時に元のタイトルのテキストを変更しますか？

Question

私は、このHTML行があります。

<div class="hide-btn top tip-s" original-title="Close sidebar"></div> 

を、ユーザーがそれをクリックしたとき、私は「オープンサイドバー」に、テキストの変更がどのように私はこれを行うことができますことをしたいですか？

これは私のJSです：

$(".hide-btn").click(function(){ 
    if($("#left").css("width") == "0px"){ 
     $("#left").animate({width:"230px"}, 500); 
     $("#right").animate({marginLeft:"250px"}, 500); 
     $("#wrapper, #container").animate({backgroundPosition:"0 0"}, 500); 
     $(".hide-btn.top, .hide-btn.center, .hide-btn.bottom").animate({left: "223px"}, 500, function() { $(window).trigger("resize");}); 
    } 
    else{ 
     $("#left").animate({width:"0px"}, 500); 
     $("#right").animate({marginLeft:"20px"}, 500); 
     $("#wrapper, #container").animate({backgroundPosition:"-230px 0px"}, 500); 
     $(".hide-btn.top, .hide-btn.center, .hide-btn.bottom").animate({left: "-7px"}, 500, function() { $(window).trigger("resize");}); 
    } 
}); 

はお時間をいただき、ありがとうございます！

Answer 1

jQueryを使用して要素の属性を変更するには、attrを使用します。 jQueryにリンクされたイベントハンドラ内で、元のDOM要素はthisとして利用できます。 jQueryラッパーを取得するには、$(this)を使用します。例えば：

$(this).attr("original-title", "new text"); 

---

サイドノート：属性original-titleはdiv要素には無効です。代わりにdata-* attributesを使用することを検討してください。私は

var a = $(".hide-btn.top"); 
a.attr('original-title', a.attr('original-title').replace(/Close/, 'Open')); 

:-)そういうことのために、このいずれかを実行したいと

Answer 2

はovercomplicatedに見えるかもしれませんが、私は多くの場合、その後、正確なラベルについての私の心を変更し、これは戻って、すべてを調整する必要が私を節約します。