How to Replace Innerhtml of a Div Using Jquery

How to replace innerHTML of a div using jQuery?

$("#regTitle").html("Hello World");

Using jQuery to edit innerHTML()

You can try this method :

$("#submitButton").click(function(){
var value=$("#formValue").val()
var advar=$('#adVar')
if(value.length>1){
advar.html(value);
}else{
advar.html("empty");
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input id="formValue" placeholder="type something here">
<button id="submitButton">enter</button>
<p>So now whatever you put in that field should appear here: "
<span id="adVar">this is the value we're replacing</span>".
</p>

How to replace the inner HTML of a div with text using jquery?

Try This:

$(document).ready(function(){
var text = $('#ctl00_ContentPlaceHolder1_ctl00_bc_content a:last-child').text();
$('#ctl00_ContentPlaceHolder1_ctl00_bc_content a:last-child').remove();
$('#ctl00_ContentPlaceHolder1_ctl00_bc_content').append(text);
});

Demo

Or you can use:

 var text = $('#ctl00_ContentPlaceHolder1_ctl00_bc_content a:last-child').text();
$('#ctl00_ContentPlaceHolder1_ctl00_bc_content a:last-child').replaceWith(text);

Demo

Find div element and replace the value-innerhtml using jquery

Bind a click on your image, and find the .divStatus, then change its content !

Remember .text() will espace your argument, instead of .html() that will render DOM elements !

http://jsfiddle.net/XL5Ew/

$(function () {
$(document).on('click', '#imgScheduled', function (e) {
$(this).parent().parent().find('.divStatus').text('in progress...');
// Or with elements
$(this).parent().parent().find('.divStatus').html($('<span>').text('in progress...'));
});
});

replace innerhtml string with specific string in jquery

You can use .html() and some regexes to get you there. Granted, using regex to read HTML will always lead to sadness but sometimes people still do it in when they have no other option.

const originalHtml = $('#some-container').html()

const convertedHtml = originalHtml.replace(/<p>/g, '<foo>').replace(/<\/p>/g, '</foo>')

Example fiddle

How to Replace innerHTML of all divs via getElementById

You should use class names as others suggested. And you will then need to iterate through the array of elements that is returned.

var elms = document.getElementsByClassName('cfmonitor');
for (var i = 0; i < elms.length; i++) {
elms[i].innerHTML = 'hi';
}

Replace a div with another html page with .innerHTML?

If you want to show another html inside another use the object element and you can use innerHTML to achieve this. Below are 2 functions for each link one will load one page and the other will load the second. The other option requires you to post your stylesheet
Hope it helps. The update to this Solution is to remove the extra scrollbar.

<script type="text/javascript">
function nextpage(){
document.getElementById('pageContent').innerHTML = "<object style=\"overflow:hidden; width: 99.25%; height: 101%\" width=\"100%\" height=\"101%\" data=\"http://localhost/test/page1.php\"></object>" ;
}
function nextpageb(){
document.getElementById('pageContent').innerHTML = "<object style=\"overflow:hidden; width: 99.25%; height: 101%\" width=\"100%\" height=\"101%\" data=\"http://localhost/test/page2.php\"></object>" ;
}
</script>
</head>
<body style="float:left; overflow:hidden; width: 100%; height: 101%">
<nav>
<h2 class="hidden">Our navigation</h2>
<ul>
<li><a onclick="nextpage();">Home</a></li>
<li><a onclick="nextpageb();">Contact</a></li>
</ul>
</nav>
<div id="pageContent">Hello motto </div>


Related Topics



Leave a reply



Submit