How to change WebPart appearance Title (WP Properties) using JSLink?

Question

Is it possible to change the Title of the List View WebPart (Title property under Appearance) using JSLink i.e using overrideCtx properties? At present, I am modifying the Title using $('span:contains("<Title>")').html("<New Title>") but the styling is not retained (for both preRender and postRender method).

Answer 1

According to the HTML of WebPart Title, your jQuery should not work. HTML of WebPart Title looks like.

<span title="Project List" id="WebPartTitleWPQ3" class="js-webpart-titleCell">
 <h2 style="text-align:justify;" class="ms-webpart-titleText">
   <a accesskey="W" href="/Projects/Lists/Project%20List">
    <nobr>
      <span>Project List</span>
      <span id="WebPartCaptionWPQ3"></span>
    </nobr>
  </a>
 </h2>
</span>

So now you can try something like following as it worked for me. As you want to use overrideCtx properties, so the code should go under OnPostRender

 OnPostRender: function(ctx) { 
        $('.ms-webpart-titleText a span:contains("Project List")').text("new title");
       }

Answer 2

For targetting individual WebParts on one screen, and without jQuery

document.querySelector(["#WebPartTitleWPQ2 nobr>span"]).innerHTML="New Title"