Develop Reference

Replacing a number found on multiple instances in div element with another number

As you can see, my HTML contains multiple references to '0'. I need to change these to '1'.
However, my jQuery isn't working.
jQuery(".create-new-location").click(function() {
jQuery("#header-logo").html().replace(/\[0\]/g, '['+(1)+']');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="header-logo" class="header-title location-header-0 title-edit-header" data-row-id="location-header-0" title="Location name (for your reference)">
<div class="input-selection title-edit-header">
<div class="text-input">
<input class="option_textbox col-sm-12 change-width title-edit" placeholder="Location name (for your reference)" value="" type="text" name="bp_theme_options[social][map][locations][0][location_name]">
</div>
</div>
<div class="open-block pencil-edit" data-row-id="location-header-0"></div>
</div>

You have to set the html like this
jQuery(".create-new-location").click(function() {
var the_html = jQuery("#header-logo").html().replace(/\[0\]/g, '['+(1)+']');
jQuery("#header-logo").html(the_html);
});
But this is not a good practice!!
When you need to change only the attribute of an <input>, why change the whole #header-logo, right? When you re-draw html like this, you risk losing event-handlers binded to the elements you have just re-drawn.
jQuery(".create-new-location").click(function() {
var elements = jQuery("#header-logo").find('input[name]'); /*all input with name*/
elements.each(function(el){
var the_name = el.attr('name').replace(/\[0\]/g, '['+(1)+']');
el.attr('name', the_name);
});
});

Regexing the html is never a good idea.
As you can see, my HTML contains multiple references to '0'. I need to change these to '1'.
The approach you used, and even the accepted answer here, will not modify the containing div with id="header-logo" which contains several of these references. Moreover, there are significant issues with simply replacing existing dom elements with freshly regexed ones in validation cases (as in, this may break your validation).
The approach you should use is to specifically target the attributes that contain these references, and then only modify those. Here is a general approach which looks in all attributes and modifies the occurrence of [0 (0 being the value of before) into [1 (1 being the value of after) as well as modifying the occurrence of -0 (before = 0) to -1 (after =1).
This will prevent removing any existing event handlers from the elements, as well as a number of other issues associated with regexing straight html and then replacing the dom element with the that result.
$.fn.indexUpdate = function(before,after){
$("*",this).add(this).each(function(){
$(this.attributes).each(function(){
this.value = this.value.replace(new RegExp('\\b\\-'+before+'\\b','g'), '-'+after);
this.value = this.value.replace(new RegExp('\\['+before, 'g'), '['+after);
});
});
};
$("#header-logo").indexUpdate(0,1);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="header-logo" class="header-title location-header-0 title-edit-header" data-row-id="location-header-0" title="Location name (for your reference)">
<div class="input-selection title-edit-header">
<div class="text-input">
<input class="option_textbox col-sm-12 change-width title-edit" placeholder="Location name (for your reference)" value="" type="text" name="bp_theme_options[social][map][locations][0][location_name]">
</div>
</div>
<div class="open-block pencil-edit" data-row-id="location-header-0"></div>
</div>

This statement jQuery("#header-logo").html().replace(/\[0\]/g, '['+(1)+']'); retrieve the html inside the element that have id as header-logo and replace every 0 inside the html string with 1 But it doesn't assign the modified string again to the element So you may want to use following code.
jQuery("#header-logo").html(jQuery("#header-logo").html().replace(/\[0\]/g, '['+(1)+']'));

Try this:It will replace all existence of '0' with '##'
$(".create-new-location").click(function() {
$("#header-logo").html().replace(/0/gi, '##')
});

add a form value with '<br>' tag

Is it possible to add a form value with <br> tag in the jQuery ajaxForm?
I know it smells of script injection but it's a valid value. The string will be like this:
"Item1<br>Item2<br>Item3"

If you are looking to insert <br> tags to an element, you can use jQuery's .append() method to add it:
HTML:
<div id="myDiv">
</div>
JavaScript:
$("#myDiv").append("Item1<br>Item2<br>Item3");

jQuery, how to find an element by attribute NAME?

I found many example finding elements by attribute value BUT not with name. I want to find all elements (can be link, button, anything) with the attribute containing deleteuserid. I tried this:
console.log($('[deleteuserid!=""]'));
but this find "everything" which not even containing the deleteuserid attribute...
something like this: jQuery how to find an element based on a data-attribute value? expect that I dont have a concrete value (in other words, I want to find $("ul").find("[data-slide=*]");

Simply use deleteuserid instead of deleteuserid!="" like following.
console.log($('[deleteuserid]'));

you can use the jquery attribute selector to search by name.
console.log($('[name="deleteuserid"]'));

You can search by simple $('[name="deleteuserid"]')
console.log($('[name="deleteuserid"]'))
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p name="deleteuserid">
</p>
<div name="deleteuserid">
</div>
<i name="deleteuserid"></i>
<b></b>

$( "*[name*='deleteuserid']" ).addClass('iFoundyou');
JSFiddle

Reference: https://www.w3schools.com/cssref/sel_attr_begin.asp
My demo:
All my selects have id="<f_field_name>"
<select id="f_type" />
<select id="f_employee" />
$('[name="form_monitoria_ligacoes"]').find('[id^="f_"]')

Appending a special character with jQuery not working

I am returning special characters (specifically °) in JavaScript/jQuery, but it is not converting the entity to the desired character in the display. How can I display the degree sign correctly?
It must be simple; what am I missing? I have checked decodeURL, but it does nothing.
Demo fiddle
The HTML:
<p>Try to give answer is: </p>
<div id="target"></div>
<p>But should look like:</p>
<div> 5 °C</div>
And the Javascript with jQuery:
$('#target').text('5 °C');
Output:

To see the interpreted character entity you need to use html():
$('#target').html('5 °C');
Updated fiddle

Try this:
$('#target').html('5 °C');
text function escapes the html characters so you get what you see.

Removing an empty div with class attribute and contenteditable value set

I am using the jQuery code to remove empty divs from my HTML upon click, so that the HTML data can be saved:
$("div:empty").remove();
This is failing to remove the following divs:
<div class="row" contenteditable="true">
</div>
I thought that this would qualify as empty. Any ideas on how to overcome this issue?

Try this, The following snippet will return the div elements with unnecessary empty spaces also.
$("div").filter(function(){
return $(this).text().trim() == ""
}).remove();
DEMO

That div contains empty space, which is considered "text" by jQuery and as such won't be selected as empty.
This markup does match the empty selector:
<div class="row" contenteditable="true"></div>