How to shorten repeating code with html function and return tags in jquery

0 votes

I'm just learning how to shorten repeating code. Perhaps someone can point me to where I can learn more about this?

 setTimeout(
function() 
{
      var dph = $("#description-paste-here");
      dph.html(function () {
        return $(this).html().replace("Please see the valuation for more information.", "This item comes with a valuation.", "For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.", "");
      });
      dph.html(function () {
        return $(this).html().replace("<br><br>For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.", "");
      });
      dph.html(function () {
        var findSHDL = $('#thestoreshdl').html();
        return $(this).html().replace("00002340", findSHDL);
      });
      dph.html(function () {
        var findStore = $('#thestorelocation').html();
        return $(this).html().replace("East Victoria Park", findStore);
      });
      dph.html(function () {
        var findHours = $('#thestorehours').html();
        return $(this).html().replace("9:30am – 5pm Monday to Saturday", findHours);
      });
}, 100);

Jun 15 in JQuery by gaurav
• 17,580 points
27 views

1 answer to this question.

0 votes

Firstly note that replace() only accepts two arguments, the string to search for and the string to replace it with. The first example provides multiple arguments which will be ignored. I presume this is just a typo.

With regards to your question, the simplest way to achieve your goal would be to hold the search.replace values in an array of objects which can be iterated through.

In addition, as you're working on the HTML of the same element in each function, you can join them all in to a single action. Try this:

let replacements = [{
  target: 'Please see the valuation for more information. This item comes with a valuation. For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.',
  replacement: ''
}, {
  target: '<br><br>For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.',
  replacement: ''
}, {
  target: '00002340',
  replacement: $('#thestoreshdl').html()
}, {
  target: 'East Victoria Park',
  replacement: $('#thestorelocation').html()
}, {
  target: '9:30am – 5pm Monday to Saturday',
  replacement: $('#thestorehours').html()
}];

setTimeout(() => {
  $("#description-paste-here").html((i, h) => {
    replacements.forEach(o => h = h.replace(o.target, o.replacement));
    return h;
  });
}, 100);
.hidden {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="description-paste-here">
  Please see the valuation for more information. This item comes with a valuation. For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.
  <br><br>For more information on this or any other item you may have seen please feel free to send me an email and I will respond as soon as possible.
  <br /><br /> 00002340
  <br /><br /> East Victoria Park
  <br /><br /> 9:30am – 5pm Monday to Saturday
</div>

<div class="hidden" id="thestoreshdl">The store HDL...</div>
<div class="hidden" id="thestorelocation">The location...</div>
<div class="hidden" id="thestorehours">The store hours...</div>
answered Jun 15 by rajatha
• 7,040 points

Related Questions In JQuery

0 votes
1 answer
0 votes
1 answer

How to pass parameters in GET requests with jQuery?

Hello, Here is the syntax using jQuery $.get $.get(url, data, ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,740 points
25,510 views
0 votes
1 answer

How to pass parameters in GET requests with jQuery?

Hello @kartik, Use data option of ajax. You ...READ MORE

answered Oct 5, 2020 in JQuery by Niroj
• 82,740 points
2,707 views
0 votes
1 answer

How to find a parent with a known class in jQuery?

Hello @kartik, Assuming that this is .d, you can write $(this).closest('.a'); The closest method returns the ...READ MORE

answered Oct 5, 2020 in JQuery by Niroj
• 82,740 points
2,234 views
0 votes
1 answer

How to use jquery with asp.net ajax?

If you weren't aware, Microsoft is planning ...READ MORE

answered Oct 15, 2018 in IoT (Internet of Things) by Annie97
• 2,160 points
190 views
0 votes
1 answer

Is 'sparkline' a method?

I suggest you to check 2 things That jquery.sparkline.js is actually ...READ MORE

answered Nov 9, 2018 in Apache Spark by Frankie
• 9,830 points
601 views
0 votes
1 answer

What is jQuery?

Hey, jQuery is a fast and concise JavaScript ...READ MORE

answered Feb 14, 2020 in JQuery by kartik
• 37,500 points
308 views
0 votes
1 answer

Error: Global Variable is not accessable to local function

Hey kartik, A variable declared outside a function has a ...READ MORE

answered Feb 19, 2020 in PHP by Niroj
• 82,740 points
283 views
0 votes
1 answer

How to add and remove classes in Javascript without jQuery

To add or remove a class on ...READ MORE

answered Jun 14 in JQuery by rajatha
• 7,040 points
9 views
0 votes
1 answer

How to call $(window).on("load", function) in jQuery-3.3.1?

Use $(document).ready() instead of $(window).on("load", function... $(document).ready(function() { ...READ MORE

answered Jun 21 in JQuery by rajatha
• 7,040 points
34 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP