Search code examples
javascriptjqueryhtmlreplaceinnerhtml

how to replace values in innerhtml using javascript


I'm dynamically(on click of radio button) copying the inner html of one row(in a table) to other but after removing some elements.

var a = document.getElementById('copyrow' + e).innerHTML;
a = a.replace('<input type="radio" name="selectradio" id="shareredio"+e "" a="" href="#" onclick="setText("+e");">',"")
    .replace('<div class="custom-radio" style="margin-top:50px;">',"")
    .replace('<label for="shareredio"+e""></label>',"")
    .replace('<input type="checkbox" name="sharecheck" id="sharecheck"+e"">',"")
    .replace('<label for="sharecheck"+e""></label>',"")
    .replace('Share fare',"");

document.getElementById('copyDiv').innerHTML = a;

I don't know enough about javascript but if there is any better way then please help...


Solution

  • This is probably not the best way to do it but I thought I'd at least give you an answer quickly. This is using jQuery to manipulate the DOM.

    var $a = $('#copyrow'+e).clone();
    $a.find('input#shareredio'+e).remove();
    $a.find('div.custom-radio').remove();
    $a.find('label[for="shareredio'+e+'"]').remove();
    $a.find('input#sharecheck'+e).remove();
    $a.find('label[for="sharecheck'+e+'"]').remove();
    
    var result = $a.html().replace('Share fare', "");
    
    $('#copyDiv').html(result);